<sub id="hsywa"><sup id="hsywa"><object id="hsywa"></object></sup></sub>
  • <span id="hsywa"><output id="hsywa"></output></span>

    <span id="hsywa"></span>

    <span id="hsywa"></span>

    恭喜你成為UI中國推薦設計師 (詳情)
    //百度統計 20220402 uicn

    您的意見是我們 UI 中國進步的動力!
    點擊立即反饋按鈕,發表您的意見!
    立即反饋
    QQ群反饋
    您也可以加入UI中國官方反饋群進行反饋!
    群號:302892100
    備注:反饋問題后@管理員能讓我們及時了解您的意見

    提交需求

    賽事與廣告咨詢合作,請填寫需求表單,我們會在第一時間與您聯系!

    0/20
    0/200

    設計大賽

    • 設計大賽
    • 發布廣告
    • 發布招聘
    • 其它需求

    提交完成
    感謝您對UI中國的支持和信賴!
    WWDC22|從蘋果大獎中發掘小而美的設計奧秘
    80.9°
    2022-06-15 | 原創文章 / 經驗/觀點 / | 舉報 | 17550 93 130 3

    今天分享2022蘋果設計大獎中小而美的幾個產品,它們為什么能進入Apple Design Awards決賽圈,一起來看看設計的奧秘。

    事先聲明 /attention :

    1. 強烈建議使用電腦查看,用戶體驗更佳。
    2. Gif 體積較大,請耐心查看。
    3.為了讓設計細節更容易被看到,用GIf來展示。




    WWDC22 全球開發者大會結束,有太多小眾產品脫穎而出。無形中有一股巨大的力量,在慢慢崛起,那便是來自世界各地的小型開發團隊和獨立開發者。他們的產品小而美,小到僅靠一個功能撐起產品,美到完全忘記這是工具產品。那么具體都有哪些產品細節,不妨聽我細細道來~


    其中,我精挑細選出一個海外和三個國區優秀產品進行產品設計細節分析,一探小眾產品究竟好在哪里!


    (專注面條 - 輕松重獲專注力)2022年Apple設計大獎入圍名單之一
    (謎底時鐘 - 讓時間看得見)2022年Apple設計大獎入圍名單之一
    (Waterllama - 開啟喝水時間)2022年Apple設計大獎入圍名單之一
    (OffScreen - 自律番茄鐘,不做手機控)Apple Store精品推薦64次


    排名不分先后,從以上幾款產品logo中可以看出產品之間設計風格基本不一樣,不存在借鑒抄襲,各自都在細分領域深耕播種。


    也正是因為開發者的敬業、精益、專注、創新的“工匠精神”,才能讓產品突出重圍,優秀的呈現在用戶面前使用。



    一、專注面條


    Slogan:專注,可以做出一碗好面條。


    你以為這只是讓人做泡面的App!那就錯了。這是用“煮一碗好面條是需要時間的”為理念,讓用戶專注工作,類似番茄工作法。


    有趣的是,這款效率工具被插畫元素完美包裹起來,一點感受不到工具給人帶來的疏遠感。相反,極具趣味性的畫面讓工具使用起來也充滿樂趣充滿愛。

    正因這上乘的設計質感,《專注面條》曾數次登上 App Store 推薦頁,至今收獲 7000+ 個評價、4.9 的評分。



    1.核心理念


    想象一下你正在烹飪一碗面條。


    在烹飪時間結束前.不要試圖拿起你的手機,這樣會讓水蒸汽流失,面條就不好吃了。日后,你可以使用專注面條完成你希望專注的任何事情。


    它把工作比喻成煮面,煮面要專心,把控火候,合適時間放入主料和調料;工作同樣要專心,遵循自己的方法論,把每個步驟和流程都執行到位。工作完成了,一碗面也就煮好了。


    專注力在哪里,效率就在哪里。


    「專注面條」希望輔助你以一種詼諧有趣的方式,重獲這個時代最稀缺的專注力。放下你的手機,煮一碗面,我們一起對抗手機成癮!


    時間一到,你的面條就做好了,你也完成了一次有意義的專注。



    2.品牌元素


    打破常規,不用系統默認蘋方字體,而是選擇手寫體風格的「素材集市康康體」字體(文末領取可商用字體包)作為通篇文字載體。


    這也是為統一界面風格做的一個優化嘗試。


    不得不說,這個選擇是非常適合的。(體量較小的產品可以適當選用設計字體,一旦產品功能做多做大還是乖乖用默認字體規范靠譜些)。


    打開App,你能明顯看到簡潔的手繪風格元素,使整個產品透傳出清新可愛的一面。這也是Alex作者受到女兒啟發,畢竟小孩子總有天馬行空的想象,但大人們卻很難跳脫現實產生有趣想法。


    App界面極其簡潔,只有黑白灰三種顏色,搭配手繪風格的設計元素,使產品整體清新脫俗,與眾不同。


    圖標設計脫離設計規范,采用更加符合產品氣質的手繪風格,這樣使得界面統一性極高,氛圍感十足。


    這也間接告訴設計師們圖標設計上一定要跟著產品形態去做設計,而不要一味以第三方規范為唯一衡量標準來設計,結果就是同質化泛濫。



    3.專注時長-插圖設計


    計時是產品核心功能,點擊首頁左上角專注時長,會出現不同的煮面方案。


    可設置5分鐘-180分鐘之內任意時長的專注時間,同時為5、10、15、20、25、30、35、40、45、50、55、60、180分鐘,這13個時間段繪制了專屬面條配方。你不用手機的時間越長,你煮的泡面配料就越豪華越高級。設計元素也越豐富。當你碰到手機,就會震動十閃光。


    面條設計方案與功能的完美呈現是產品最吸引人的地方。



    4.設計細節


    根據累積的專注時長還可以獲得相應的稱號,配合幸苦工作后汗水落下動畫,很是生動有趣。


    不僅如此,專注面條還特意為女性男性做了兩套插圖設計方案,充分考慮不同群體的使用體驗,僅僅是效率型產品就做到如此細節,不好才怪。


    這也是除了故事卡片第二種用總時長配圖來增加產品使用黏性產生記憶點的設計之處。



    5.商業模式-永久買斷與付費項目


    5.1.永久買斷制


    【專注面條】一次買斷制,面條價格¥18。購買后產品內的功能都可使用。但“故事卡片”需要鑰匙來解鎖,¥6.00=鑰匙*6,不想付費那就乖乖完成計時任務來隨機獲得故事卡片。


    作為一個功能單一的產品,賣點在哪里?核心競爭力在哪里?依碳水Sir來看付費用戶大多在為品牌理念買單。


    就是產品自身的品牌調性,區別于市面上任何一款產品,不隨波逐流,用全新的面條理念代替時間,并且有其鮮明的手繪風格和插圖元素,即使被抄襲也只能抄到“外殼”,內在的東西是偷不走的。


    5.2.購買鑰匙


    專注完成后,靠概率獲得鑰匙,用來解鎖故事卡片以及 “腦洞大開” 的結局作為獎勵。緩解你專注后的緊張感,增加趣味互動性,同時為下一次專注做好準備。


    故事中皮諾曹、烏鴉喝水、長發公主等雖然都是我們耳熟能詳的童話,但作者( Alex )給他們加上了一些彩蛋。譬如在《猴子撈月》的卡片里,解謎前三個猴子看到河流中有一個圓圈,當我們找到面條的位置時,會發現猴子們看到的不過是一個香菇都大為震驚,畫面里充滿奇妙的想象力。


    當用戶看到未解鎖的故事會出于好奇點進去,這時就需要鑰匙來解鎖,畢竟不是靠專注獲得的卡片就要用別的辦法(購買鑰匙)打開,這就是第二個商業轉化點。


    目前已有的27張故事卡片,每一個都與面條結合進行故事綁定,讓用戶在效率軟件中也能感受到游戲的樂趣,把故事卡片當成解鎖過關元素,引發用戶對故事卡片更多的渴望。這也是通過獎勵機制提高用戶參與感進而提高使用黏性以及提升付費轉化的一種方式。



    一個動作,一堆腦洞,組成了一個能量滿滿的 app。


    6 月 1 日,蘋果發布了 2022 年度設計大獎入圍名單,在「創新思維」類別中出現了中國區《專注面條》的身影,雖然止步于決賽圈,但我覺得這并不是結束,而是全新的開始。


    優秀的產品總有其相似之處,也有其不同。要想做一款好的小眾產品,除了把產品本身所解決的用戶痛點做好做精外,植入產品理念,與用戶產品某種關聯。


    就如它把專注計時比作烹飪時間,當完成專注,你將獲得一碗香噴噴的泡面一樣,給用戶感受并不是冷冰冰的機器“叮”的告訴用戶專注結束,而是通過巧妙的設計與用戶之間產生真實聯系,這或許就是成功的秘密。


    借用「專注面條」Slogan說的:專注,可以做出一碗好面條。


    各位設計師們不妨學習一下背后的思考。



    二、謎底時鐘 - 讓時間看得見


    謎底時鐘是一款設計精美的時鐘應用。


    Slogan:陪伴你學習、工作與生活。


    你沒看錯!它僅有時間和計時功能。


    作為一款時鐘App,UI設計有什么不同,才被入選2022 蘋果設計大獎!成為中國開發者之光!我們一起來看看。


    1.首次引導


    第一次下載,就會啟動引導流程,切換頁面時配合錯幀動畫,使設計細節更加突出明顯,強化品牌調性。產品中的引導頁都可以嘗試這種表現形式。


    進入首頁,展示文字+動效的引導流程,統一的表現形式,讓使用者更容易理解。首頁交互引導,讓用戶對產品隱藏的交互功能得到二次記憶,具有增強產品記憶的作用。



    2.品牌元素


    2-1.設計元素


    品牌風格設計很前沿,采用2020年大火的新擬態設計風格,也能看出設計表現緊跟市場潮流走,是一款個性且年輕的App。


    整體使用下來,印象最深的就是模塊列表、圖標的微質感設計,以及彈窗布局的規范化設計,還有部分組件采用毛玻璃設計手法等。


    值得注意的是,產品對iOS原生組件進行大量重新設計,結合新擬態風格繪制了一套更符合產品調性的組件出來。讓人使用一次就記憶猶新。


    2-2.核心力-交互感知


    我分別羅列出計時切換器、計時完成動效、時間選擇器、鬧鐘動效、刪除交互、浮窗切換交互這六個來簡單談談看法。以下幾個動效交互基本涵蓋市面上的多半產品的基礎功能,之所以展示出來,是因為「謎底時鐘」在原有的基礎組件上大膽創新,摒棄原生組件。


    這樣做對于功能簡單的產品來說絕對是錦上添花有助于產品形成記憶點的設計細節。這也從側面反映出市面上的部分產品,只注重功能堆疊而完全忽視原生組件還可以二次設計的方向。


    什么是好的交互,操作時無感知是一種,操作時有記憶點也是一種。顯然「謎底時鐘」是后者。要知道優秀的交互自成一派,把單一的功能做到極致,你的產品就不會差到哪里。



    3.彩蛋-圖標變化與提醒


    時鐘就是要長時間靜默展示,除了極簡、擬物、科技、馬賽克、霓光、積木、微質感、電子屏、睡眠屏、卡通風、各類鐘表材質等等19種風格高顏值時鐘外,霓光時鐘具有不一樣的功能。


    當你早晨使用它文案“早安晨之美”中午“午安好心情”下午“飲啖茶食個包”,除了文案變化,圖標也跟隨名稱而變,又一個用美食來拉近與用戶距離的設計細節。


    不僅如此,在低電量情況下,霓光效果不顯示,底部會持續閃爍電量不足的指示燈,告訴用戶手機沒電信號,請及時充電。當用戶插上電源,霓光時鐘會重新啟動亮光模式,給予用戶通電感知。


    雖然很小的設計點,但誰又能想到時鐘與電量不足產生聯系??磥黹_發者對時鐘的創意聯想是豐富多彩的。



    4.彩蛋-積木時鐘墜落


    無意間觸碰手機時發現積木零星掉落下幾個,在好奇的驅使下又晃動了一下手機,所有積木都掉落下來了。


    具有數字屬性的積木依然不斷變換數字,并且配合手機陀螺儀可以模擬現實空間進行移動,交互玩法趣味十足,讓我忍不住多玩了幾次。


    這種用到iOS系統功能做的大膽嘗試,有時會給產品帶來意想不到的好處,各位總監們不妨試試。



    5.商業模式-細節之處


    采用終身會員與月會員模式,月會員很好理解,為了產品能持續做下去,而推出的付費模式,目的是能持續有營收。終身會員是一個很有意思的模式。


    據了解,產品前期功能相對單一時,推出的一種買斷制,但隨著新功能不斷增加,原有¥25定價相比較低,早期買斷的用戶獲利更大,為了商業與產品平衡,使其具備良性發展空間,于是又推出月會員模式。


    這也牽扯到另一點,凡是未上線新功能都可以輕松決定是否開發上線,一但功能上線,想要取消或抹掉功能,就沒那么輕松簡單了。這也是早期App都一次買斷,后期改為訂閱模式也必須有終身買斷的內購入口。




    如果我們是“匠人”就會把 App 當藝術品,雖然只有也僅有一種功能,但只要花費了大量的時間去想創意,去做到設計、交互的完美融合,甚至一遍一遍地優化各種細節部分,埋設彩蛋,最后的最后呈現出來讓自己滿意。那么它就很可能成為一款小而美的產品。



    三、Waterllama


    烏克蘭開發團隊出品。讓喝水變成一件快樂輕松的活動。僅有的喝水記錄功能,卻用大量動物角色來獎勵喝水后的你,讓你欲罷不能。保持水分保持快樂!從截圖中不難看出,該App內置大量動物插圖,通過喝水來解鎖小動物,解鎖前僅展示動物輪廓,讓用戶產生好奇從而保持喝水好習慣,這個概念很好,產品很棒,那我們一起來看看吧。


    1.品牌元素


    產品中icon展示較少,更多是用小插畫來代替,頁面中大量的banner以及動物卡片,豐富產品的同時營造一種輕松的感覺。并沒有很多圖標干擾用戶操作。與水相關的插圖用動效來承載,讓簡單的元素變得趣味橫生,很是新穎。除了普通的水以為,Waterllama還為各種飲料酒水做了全套icon,共計48+之多,可見產品對于水的核心功能做足了努力,才有如此多的類型與選擇供用戶記錄。



    2.核心功能


    無論您是想休息一下咖啡因,還是想通過果汁和冰沙來增強免疫系統 - 選擇任何挑戰,盡情享受吧!
    遠離含糖飲料和酒精,或者在 10 天內只喝水補充水分??纯茨愕倪M展如何,別忘了與朋友分享你的結果。
    Waterllama 應用程序中已有超過 45 個可愛的動物角色,我把解鎖與隱藏的都羅列到上放品牌元素中,可以看下總有一款是你的菜。你也可以使用隨機模式,讓每一天都變得不同。當天喝水目標達成就會解鎖一個動物,精美的插圖讓人賞心悅目,期待第二天繼續喝水打卡挑戰。



    3.交互手法


    首頁下方的動物挑戰卡片,交互形式采用App Store卡片點擊交互,無論是轉場過度,還是下拉放大主體都給畫面賦予趣味性操作體驗。一邊體驗交互細節,一邊了解喝水的各種好處,娛樂加學習兩不誤,很是輕松。


    4.商業模式-細節之處


    內購頁面采用icon輪播的動效展示,優點是在一小塊區域通過消失漸現可以展示所有內容,使內購頁面干凈清爽能更好的閱讀頁面信息。按鈕通過循環放大,引導用戶進行付費操作,雖然很刻意,但絲毫沒有感受到強制性選擇。
    當產品想要在內購頁強化品牌背書,給到用戶可靠穩定感,可以選出具有代表性的優質評價,展示在內購頁下方,通過左右切換查看更多評價。
    每年¥28,終身買斷制¥48.00。兩個價格是利用價格差來制造價格錨點,引導用戶購買終身會員,這對用戶來說最實惠劃算的方案,同時也是產品所希望的。大量的終身用戶長時間使用產品,成為核心用戶群體,助力產品越做越好。



    現在不難看出,優秀的產品往往更關注細節表現,用動態展示內容,讓玩法更具趣味性,頁面簡約而不簡單。并不是頁面元素越多越好,相反把簡單的功能做到極致就會帶來正向有價值的反饋。



    四、OffScreen - 自律番茄鐘,不做手機控


    這款產品雖然沒出現在WWDC22上,但與「謎底時鐘」是同一家公司。無論設計或功能使用都相媲美。
    手機已成為人人必備的物品,內置的各種App占有著人們的生活,手機依賴已成為這個時代普遍的一種現象。雖然人們都知道長時間看手機不好,下意識的克制看手機行為,以為這樣脫離手機依賴患者這個稱號。往往碎片化看手機,一天下來使用手機的時長不降反增?!窸ffScreen」通過細分時間屬性為用戶直觀呈現各種場景下使用手機的詳細數據,通過數據展示以及專注時間,防止用戶沉迷手機無法自拔。



    1.品牌元素


    「OffScreen」背景色使用極其大膽。


    淺色模式下采用暖橘色作為品牌主色調,暗色模式下采用海藍色作為主色調,相比Apple設計規范中的顏色,這種帶有傾向性的色彩更容易營造一種產品氛圍,強化產品感知度。


    圖標方面,具有操作屬性的圖標采用線性(相對好理解),具有展示屬性的圖標采用面性風格(設計表現更強且有文字描述相對好理解)。


    2.動效表達1


    引導流程專場用了大量位移、漸變效果,使原本單調的靜態頁賦予生動表現力。吸引用戶眼球,達到品牌傳播效果。



    3.動效表達2


    動效貼合操作效果,用戶還沒使用就能一眼明白產品如何使用,這就是引導動效的好處。


    當你專注番茄鐘時,只需在番茄上滑動標尺選擇準確時間,就能開始專注。


    當完成專注會提供統計數據,并且有彩帶飄落效果,營造打卡勝利的儀式感,強化產品感知,為用戶下一次專注做準備。



    4.商業模式-細節之處


    內購頁采用依次呈現的交互方式,頭圖是一個人在看手機,采用線性風格手法,這種形式區別于其他產品,會給人以眼前一亮的感覺,加深用戶對產品的記憶。


    付費按鈕吸附與頁面底部,根據菲茨定律,起始于目標位置越近,到達目位置的時間就會越短,從而用戶更容易點擊。


    一次買斷制,¥30.00解鎖終身會員。


    作為一款時間統計、番茄鐘、專注時間與一身的產品,對于時間管理有強需求的用戶來說價格還算不錯。流暢的交互呈現以及有趣的配圖描述,間接感受到Off Screen產品的細膩之處,用戶為此買單也不是說。



    OffScreen的成功在于能把單一的屏幕使用時間進行多維度分析呈現,就說“呆呆的看”與“邊走邊看”這兩項數據,就是調用系統運動數據來判斷使用屏幕的場景。


    況且每項數據都支持時間軸可視化圖表的方式呈現,細節之處方見專業,這也是好產品所要具有的垂直領域專業度。



    五、產品總結


    想要產品脫穎而出,一定要嘗試將軟件與硬件結合,可以是陀螺儀、眼動追蹤、閃光燈等等,總之系統推出新的功能,就盡量把它用到產品里去。


    不僅如此,看以上幾個產品,截圖模塊內容都頂滿了,說明App想要展示的細節還有很多,從側面也能看到開發者們不留一塊“空白”的用心。


    大廠產品固然很好,做法更符合大眾市場符合消費者需求,隨著不斷新增功能,產品變得越來越普適大眾,無產品獨特風格可言。因為背后有龐大的員工要養活。


    相反小團隊獨立開發者們沒有太多顧慮,一心想把一個點做好做緊致,哪怕只是計時,也要做的自己滿意為止,才會交卷,時代在變,匠人之心從未改變。值得致敬這些開發者們。



    跳脫大廠的產品,來看看獨立開發者和小型開發團隊,一人即團隊,遇到各類問題都要獨自進行解決,可想而知工作量會有多大。


    他們的產品或許沒有龐大的生態體系來滿足大眾用戶使用需求,但App Store十余年的發展,建立起細顆粒的開發環境,正是這種良性生態,讓那些有光的開發者,隨心所欲讓心中的想法變成現實,讓夜里的小路燈照亮了整片街道。


    就連開發者們都這么拼搏,作為設計師的我們哪還有抱怨之說,這么多好的產品擺在眼前,真是難得的學習機會,習他人之處,補自我之短。一起加油一起進步。


    六、結語


    設計師要有發現美的眼睛。美不僅是視覺,還有好的體驗流程。不要讓用戶思考,這是每個設計師所追求的。 認真記錄產品細節,了解背后的思考,也是不斷提升自己邏輯思維和表達能力的一種方式。


    本期產品細節分析結束,我們下期再見!


    本文由 @碳水Sir 原創發布。未經許可,禁止轉載。

    Powered by Froala Editor

    創建于:2022-06-15

    收藏

    93人已收藏

    評分:

    完整度:5星

    啟發性:5星

    勤奮性:5星

    排版布局:4星

    推薦:
    作品完整度較高,對設計師有很大的幫助 ~~~~~

    碳水Sir

    什么是幸福感!進步就是幸福感。

    • 14

      作品

    • 83

      粉絲

    • 49

      關注

    • 網易云音樂|情感驅動設計的制勝法寶之產品亮點
    • 多身份|體驗B站 嗶哩嗶哩 bilibili 小破站產品設計
    •  分析2022年大廠新孵化的App,探索設計的獨特之處
    • 10個助力產品增長的設計細節

      猜你喜歡

        2022-06-15 | 原創文章 / 經驗/觀點 / | 舉報 | 17550 93 130 3

        WWDC22|從蘋果大獎中發掘小而美的設計奧秘

        80.9°

        你確定要舉報WWDC22|從蘋果大獎中發掘小而美的設計奧秘?

        如果查出惡意舉報,十天內禁止提交任何舉報申請。

        0/200

        上傳證據: 超過10M的附件請使用網盤地址

        點擊上傳附件

        對誰可見:

        全部設計師
        • 全部設計師
        • 推薦設計師和認證設計師

        您確認要推薦?

        該作品發布時間:2022年06月15日

        評分

        完整度

        啟發性

        勤奮性

        排版布局

        推薦心得

        建議20-200字以內

        0/200

        130
        93
        3

        賬號或密碼錯誤,請重新輸入

        賬號或密碼錯誤,請重新輸入

        登錄

        手機號

        發送驗證碼 120s 驗證碼錯誤

        登錄
        第三方賬號登錄
        又黄又粗暴的变态小说
        <sub id="hsywa"><sup id="hsywa"><object id="hsywa"></object></sup></sub>
      • <span id="hsywa"><output id="hsywa"></output></span>

        <span id="hsywa"></span>

        <span id="hsywa"></span>