魅族官方詳解Flyme界面設(shè)計

2014-5-27    藍藍設(shè)計的小編

轉(zhuǎn)載藍藍設(shè)計(   www.bouu.cn  )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供有效的   BS界面設(shè)計 、 cs界面設(shè)計 、  ipad界面設(shè)計   、  包裝設(shè)計 、  圖標(biāo)定制 、  用戶體驗 、交互設(shè)計、   網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)

來源:http://news.mydrivers.com/1/300/300328.htm

魅族官方今天發(fā)文,詳細解釋了有關(guān)Flyme界面的設(shè)計理念和進化。魅族表示,簡潔,一直是魅族崇尚的信條之一。從早期M8的驚艷亮相開始,魅族概括式的設(shè)計理念已經(jīng)貫穿了整個機器內(nèi)外

Flyme系統(tǒng)是魅族專門為旗下手機開發(fā)的一套基于Android深度定制的系統(tǒng)。2009年2月18日魅族推出第一個基于Windows CE6.0內(nèi)核的正式版本手機操作系統(tǒng)(只適用于魅族M8,稱為Mymoblie操作系統(tǒng)),此后推出了為M9及MX深度定制的基于Android 2.2和Android 2.3的操作系統(tǒng)(未正式確立專有名稱),直到2012年6月25日才將為旗下手機基于Android 4.0.3的手機操作系統(tǒng)正式確立為“Flyme”。Eico Design亦參與其設(shè)計。此系統(tǒng)正式版本為適用于MX3的Flyme 3.0。

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

Flyme系統(tǒng)是魅族設(shè)計理念在軟件更深層上的體現(xiàn),也是魅族手機的核心競爭力之一,被魅族稱為“產(chǎn)品的靈魂所在”。

借此之機,讓我們一起來了解一下Flyme的設(shè)計精髓

簡潔,一直是魅族崇尚的信條之一。從早期M8的驚艷亮相開始,魅族概括式的設(shè)計理念已經(jīng)貫穿了整個機器內(nèi)外。

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

而同期的主流智能手機長相是這樣:

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

這些曾經(jīng)紅極一時的設(shè)備在當(dāng)時算是潮物了,可今天看來,依然有上個時代濃濃的印記?;仡^看看M8,現(xiàn)在仍然是一款值得欣賞的機器。這是為什么?

至簡,方不能被超越

M8的設(shè)計高度概括了手機的外形,除了手機本身的圓滑輪廓之外,沒有額外多余的凹凹凸凸。任何的異形都會被賦予嚴(yán)重的時代印記,只有朝著至簡的方向前行,才能獲得恒久。

這也是我今天想說的,借助M8的ID設(shè)計開頭,談一談Flyme系統(tǒng)的圖標(biāo)進化演變的歷程。

先上一張預(yù)覽圖,這是從M8至MX3(Flyme 3.0)的部分圖標(biāo)進化過程。(感謝魅族匯整理)

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

雖然M8搭載的是Windows CE時代的產(chǎn)物,M9及之后的MX系列都轉(zhuǎn)變?yōu)锳ndroid系統(tǒng),但M8的一些圖標(biāo)在今天仍然得到了很好的傳承。

簡潔是進化

在人類的進化歷程中,隨著人們對事物的認(rèn)知提高,由具象到抽象的映射能力更加完善。我們生活中的產(chǎn)品也在慢慢的變的更為抽象。

例如,我們可以清晰地知道魅族官方發(fā)文詳解Flyme界面設(shè)計理念這個按鈕是播放, 魅族官方發(fā)文詳解Flyme界面設(shè)計理念而這個按鈕是暫停。

它們與現(xiàn)實中我們所認(rèn)識的樣貌相去甚遠,甚至在使用它的過程中我們從不會去考究它為什么是這個樣子,只知道這是播放與暫停。實際上這都是一步步演化而來,在這過程中摒棄一些復(fù)雜的元素,歸納為簡單明了的形狀,讓人們逐漸習(xí)慣、理解并適應(yīng)了這樣的認(rèn)知過程。

再例如下載,這是一個現(xiàn)實中并不存在的行為,人們?nèi)绾闻c其建立映射關(guān)系?

魅族官方發(fā)文詳解Flyme界面設(shè)計理念初始,人們覺得一個箭頭表示下載,一個硬盤代表本機,箭頭指向自己的硬盤,表示“下載”。

魅族官方發(fā)文詳解Flyme界面設(shè)計理念而如今,你可能只畫成這樣,人們便可以理解它是做什么用的。類似圖標(biāo)還有分享(Share)、刷新(Refresh)、更多(More)等。

歸根結(jié)底,這是具象到抽象的一個過程,在這當(dāng)中,人們逐漸拋棄無用的過多元素,改用更簡潔的線條(方式)去概括原本的形狀。在傳播過程中,簡潔的內(nèi)容可以更低成本但卻更形成快速傳播和記憶,無需人們?nèi)ハ毠?jié),直接觸碰大腦最直接的記憶輪廓。所以,簡潔,是人類社會的趨勢。

好的歷史需要傳承

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

時鐘:從M8到MX3的視覺變化在于:去除表盤外殼的高光,去除指針的外發(fā)光,簡化表盤邊緣的金屬質(zhì)感,去掉秒針和去除表盤的黑色漸變。最終你所看到的形狀,仍然可以非常清晰地知道它就是個“時鐘”,冗余的“效果”在演化過程被一一剔除,而配色仍得到很好的傳承,設(shè)計方向也愈加明確。

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

設(shè)置:具象的齒輪本身屬于擬物的設(shè)計方式,形狀太過粗暴,是似而非。最終,提取其金屬灰色,將整個齒輪變?yōu)橐粋€按鈕,上面的圖形則簡化為剪影,遠比單色的齒輪剪影要更好。

創(chuàng)造新形狀:

魅族官方發(fā)文詳解Flyme界面設(shè)計理念
 

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

瀏覽器:M8時代的瀏覽器是一個具象的地球,與當(dāng)時的PC瀏覽器外觀一致,但恰恰由于細節(jié)復(fù)雜,難于記憶,并且沒有打出魅族品牌與其它瀏覽器的差異化。然而,創(chuàng)造一個新形狀的成本很高,人們對新事物的未知會造成對圖標(biāo)表意的理解缺失。新的瀏覽器圖標(biāo)外輪廓仍然保持了圓形(映射地球),中心的M意在強調(diào)魅族品牌,圓環(huán)則表示載入進度,我們通過這種方式來讓用戶在數(shù)年間成功建立了映射關(guān)系,并以此維護用戶對“魅族瀏覽器”的認(rèn)知。

在系統(tǒng)主界面的背景設(shè)計上,我們同樣盡可能為扁平化的圖標(biāo)提供視覺景深。

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

所以我們并沒有試用傳統(tǒng)的實景圖片,實景圖片會對扁平的圖標(biāo)造成視覺上的干擾,所以我們選擇用色彩的跨度去區(qū)分桌面與圖標(biāo)之間的視覺景深,選用了更灰、更深的顏色,而圖標(biāo)則選用更明快的色彩。通過明度、飽和度的區(qū)分,在視覺上可以更直接快速的分層。

魅族官方發(fā)文詳解Flyme界面設(shè)計理念

如同保時捷的汽車一樣,在Flyme數(shù)年的進化中,我們保持了屬于Flyme的DNA,好的設(shè)計一定有可以恒久傳承下來的東西。

If you have something good,don’t change it,make it better.

分享本文至:

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://www.bouu.cn

存檔