首頁

關(guān)于“薅羊毛”那些事兒——百度果園長(zhǎng)線活動(dòng)設(shè)計(jì)思考

seo達(dá)人


一、長(zhǎng)線運(yùn)營(yíng)活動(dòng)的價(jià)值

百度APP作為移動(dòng)生態(tài)的搜索信息服務(wù)產(chǎn)品,用戶會(huì)在什么場(chǎng)景想到百度APP并使用它呢?

十幾年前,精力有限睡眠有限的打工人不惜犧牲睡眠時(shí)間,也要設(shè)置凌晨3點(diǎn)的鬧鐘;上網(wǎng)時(shí)間被嚴(yán)格控制的學(xué)生黨也要注冊(cè)五六個(gè)QQ小號(hào),目的很明確:到點(diǎn)“收菜”,蹲點(diǎn)“偷菜”。十幾年后每天早上睜眼先去螞蟻森林收收自己的“能量”,再順路去螞蟻莊園喂喂小雞,安排很多手機(jī)號(hào)碼來種水果……各家產(chǎn)品通過帶有游戲氛圍的運(yùn)營(yíng)活動(dòng)把產(chǎn)品的服務(wù)和功能以趣味化的方式傳遞給用戶,讓用戶“薅羊毛”拿福利的同時(shí)也給產(chǎn)品帶來增長(zhǎng)價(jià)值。

圖片

 

二、百度果園設(shè)計(jì)打法

本文以百度果園為例,從長(zhǎng)線運(yùn)營(yíng)增長(zhǎng)視角分3個(gè)方面分享運(yùn)營(yíng)活動(dòng)玩法如何設(shè)計(jì),如何幫助百度APP持續(xù)提升用戶活躍和用戶留存:

1.建立心智:讓用戶相信百度果園的真實(shí)性,愿意參加活動(dòng),安全的“薅羊毛”;

2.養(yǎng)成習(xí)慣:根據(jù)用戶不同的屬性,設(shè)計(jì)玩法讓用戶養(yǎng)成來百度果園澆水的習(xí)慣,實(shí)現(xiàn)百度APP的長(zhǎng)期留存同時(shí)把“羊毛”薅到手;

3.平衡:種植真實(shí)性+趣味化的方式傳遞給用戶,實(shí)現(xiàn)產(chǎn)品增長(zhǎng)和用戶福利的雙重價(jià)值,“羊毛”薅不停。

圖片

 

1、心智建立:讓用戶相信百度果園的真實(shí)性,愿意參加活動(dòng),安全的“薅羊毛”;

A 從新用戶視角打造真實(shí)性:新用戶上我們區(qū)分兩個(gè)用戶角度進(jìn)行設(shè)計(jì):

  • “薅羊毛”心理用戶:了解各類平臺(tái)的運(yùn)營(yíng)活動(dòng),酷愛“薅各個(gè)平臺(tái)的羊毛”,對(duì)福利性質(zhì)的運(yùn)營(yíng)活動(dòng)非常敏感;進(jìn)入百度果園最先看到Loading頁面,從Loading頁面開始就在文案上告知用戶“免費(fèi)水果包郵到家” 的福利性信息,圖片內(nèi)容也是傾向于真實(shí)水果,利益點(diǎn)明確從而讓用戶繼續(xù)往下進(jìn)行;利益文案和真實(shí)水果圖片繼續(xù)延續(xù)到“選種子”頁面上,明確的福利信息與行動(dòng)點(diǎn)來打造百度果園的真實(shí)性。
  • “從眾心理”的用戶,這類用戶會(huì)被「TA人已經(jīng)獲得免費(fèi)福利」的信息所打動(dòng),所以我們?cè)凇斑x種子”頁面下方增加了動(dòng)態(tài)彈幕,就像耳邊有個(gè)聲音在和你說:“隔壁已經(jīng)領(lǐng)了3斤免費(fèi)水果了,快來一起!”動(dòng)態(tài)彈幕不僅是在信息上吸引用戶參與活動(dòng),也是側(cè)面描述了百度果園活動(dòng)的真實(shí)性,與用戶建立信任。

圖片

B 精細(xì)設(shè)計(jì)果樹成長(zhǎng)階段,與真實(shí)場(chǎng)景貼合:

為了營(yíng)造更加真實(shí)的種植體驗(yàn),我們?cè)诎俣裙麍@視覺呈現(xiàn)上也進(jìn)行了升級(jí),整體視覺效果與真實(shí)果樹成長(zhǎng)的6個(gè)階段(種子→幼苗→大樹→開花→果實(shí)→成熟)更加匹配,建立更加真實(shí)的果樹成長(zhǎng)過程,追求合理性和沉浸感,并且細(xì)化每一個(gè)不同水果對(duì)應(yīng)的樹、花朵、果實(shí)形態(tài),讓用戶在參與活動(dòng)的過程中體驗(yàn)果樹成長(zhǎng)到成熟的真實(shí)感受,也是在視覺效果上形成百度果園的特色。

圖片

C 貫穿全流程的澆水動(dòng)畫增加真實(shí)性:

  • 我們?cè)跐菜畡?dòng)畫上進(jìn)行了體驗(yàn)升級(jí),澆水動(dòng)畫分前中后3步設(shè)計(jì)來增加澆水的真實(shí)感受:
  • 嘗試通過動(dòng)畫模擬生活中水壺澆水的行動(dòng)動(dòng)線,點(diǎn)擊澆水后水壺移動(dòng)至樹的位置并傾斜至澆水方向,傾斜的同時(shí)水開始從水壺里露出水滴,整條澆水動(dòng)作一氣呵成;
  • 在澆水過程中,水滴分層陸續(xù)從水壺中澆水至樹下土壤,下落時(shí)水滴逐漸變?nèi)酰拖裾娴牡温溥M(jìn)土壤一樣;
  • 明確的澆水反饋,澆水動(dòng)畫完成后,我們?cè)跇淠竞屯寥郎贤瑫r(shí)增加了光感反饋動(dòng)畫,就像是樹木真實(shí)的吸收到了水分一樣,生動(dòng)輕松的反饋給用戶,讓每一次澆水都有視覺上的滿足。

圖片

 

2、習(xí)慣養(yǎng)成:根據(jù)用戶不同的屬性,設(shè)計(jì)不同玩法讓用戶養(yǎng)成來百度果園澆水的習(xí)慣,實(shí)現(xiàn)百度APP長(zhǎng)期留存的同時(shí)讓用戶把“羊毛”薅到手。我們參考百度果園線上老用戶數(shù)據(jù),把用戶分成3類,分別根據(jù)他們不同特點(diǎn)進(jìn)行針對(duì)性的玩法設(shè)計(jì):

  • 沉默用戶:這類用戶很少來果園玩,活躍的時(shí)間也較少,很難長(zhǎng)期堅(jiān)持澆水;對(duì)于這類用戶,我們嘗試設(shè)計(jì)快速領(lǐng)水果的玩法吸引他們,把領(lǐng)水果當(dāng)成一個(gè)完整的大目標(biāo),直接明確出領(lǐng)水果的時(shí)間周期,同時(shí)也把難完成大目標(biāo)切割成每天要做的簡(jiǎn)單小目標(biāo),每天召回用戶完成當(dāng)日任務(wù),從而抓住用戶回流。
  • 忠實(shí)用戶:對(duì)于留存穩(wěn)定的忠實(shí)用戶,我們給這類用戶增添游戲趣味,來百度果園做任務(wù)澆水時(shí)給到用戶游戲感受,我們?cè)O(shè)計(jì)了“瓜分”玩法,給到用戶一些驚喜感受。
  • 召回用戶:“來幫大姨澆個(gè)水”,是不是經(jīng)常在微信群里看到這樣的消息,對(duì)于幫助好友達(dá)成目標(biāo),我們?cè)O(shè)計(jì)了“合種”玩法給到用戶,由一人玩百度果園到帶動(dòng)身邊親朋好友一起玩,幫助用戶更快一步達(dá)成領(lǐng)水果的目標(biāo)。

圖片

A  沉默用戶喚醒:

「澆水挑戰(zhàn)領(lǐng)水果」玩法參考上癮模型進(jìn)行設(shè)計(jì),從push滲透入口到用戶,基于「稀缺」核心驅(qū)動(dòng)力讓用戶產(chǎn)生興趣,引導(dǎo)用戶進(jìn)入活動(dòng);當(dāng)用戶進(jìn)入果園后,通過大轉(zhuǎn)盤抽獎(jiǎng)的方式繼續(xù)抓住用戶的注意力,持續(xù)利用「稀缺」「緊迫」心智讓用戶進(jìn)入活動(dòng)開始體驗(yàn)玩法。開啟澆水挑戰(zhàn)后果園首頁上方增加明確的澆水進(jìn)度提示,讓用戶了解整體玩法進(jìn)度,從而建立收獲獎(jiǎng)勵(lì)的信心。

圖片

B 忠實(shí)用戶-豐富游戲玩法:

百度果園是一個(gè)長(zhǎng)線養(yǎng)成類運(yùn)營(yíng)活動(dòng),為了讓老用戶持續(xù)保持新鮮感,我們?cè)诠麍@里增加具有趣味性的「瓜分水滴」玩法,是參與兩日就可獲得獎(jiǎng)勵(lì)的輕量化的玩法。第一天用戶進(jìn)入「瓜分水滴」活動(dòng),通過大額水滴獎(jiǎng)池吸引用戶的注意力,提起用戶的參與興趣,在行動(dòng)操作上弱化付出成本突出行為動(dòng)作,引導(dǎo)用戶點(diǎn)擊;用戶報(bào)名后及時(shí)提醒用戶打開訂閱增加觸達(dá)場(chǎng)景;并在彈窗上對(duì)付出成本與收獲回報(bào)進(jìn)行對(duì)比,吸引用戶第二日再次打開百度果園參與領(lǐng)獎(jiǎng);在領(lǐng)獎(jiǎng)的同時(shí)直接引導(dǎo)報(bào)名下一期活動(dòng),持續(xù)拉動(dòng)用戶回流。

圖片

C 召回用戶-好友之間的互動(dòng)玩法:

為百度果園賦予情感與故事性,好友社交上分兩步探索,第一步引導(dǎo)用戶去“偷”好友的水滴,在好友之間持續(xù)互動(dòng),水滴是貫穿百度果園整體玩法的重要代幣,好友的水滴被“偷”,就降低了好友“薅羊毛”的速度,但對(duì)用戶自己來說,“偷”水也需要“偷”的高效,我們?cè)诠麍@里增加了連續(xù)“偷”水動(dòng)作,邊“偷”水邊把好友喊回來;為了豐富用戶的體驗(yàn)感受,在好友果園跳轉(zhuǎn)之間增加了樹葉遮擋的動(dòng)畫效果,動(dòng)畫轉(zhuǎn)場(chǎng)同時(shí)也是替代小程序白屏轉(zhuǎn)場(chǎng)的好思路,營(yíng)造了好朋友在果園之間串門的感受。

圖片

第二步好友互動(dòng)持續(xù)升級(jí),通過家庭合種的概念加強(qiáng)用戶之間的聯(lián)系,情感化的方式來提升用戶主動(dòng)參與意愿,拉動(dòng)身邊親朋好友一起加入“薅羊毛”的隊(duì)伍,一方面幫助用戶提升領(lǐng)水果的速度,另一方面也幫助百度果園在用戶上實(shí)現(xiàn)破圈。在玩法設(shè)計(jì)上我們區(qū)分3個(gè)視角進(jìn)行設(shè)計(jì):

  • 合種的發(fā)起者:突出快速收獲,激勵(lì)用戶分享拉好友來幫忙種植水果,通過儀式感轉(zhuǎn)場(chǎng)和主視覺的變化營(yíng)造家庭故事氛圍;
  • 幫種者視角:通過彈窗上操作確認(rèn)加入合種小隊(duì),加入合種后在每次澆水時(shí)增加『謝謝你幫我澆水』的情感動(dòng)畫反饋,烘托幫種氛圍;
  • 共同利益視角:階段式的獎(jiǎng)勵(lì)激勵(lì)用戶召回和拉新的好友,把共同“薅羊毛”的氛圍拉滿。

圖片

 

3、平衡:種植真實(shí)性+趣味化的方式傳遞給用戶,實(shí)現(xiàn)產(chǎn)品增長(zhǎng)和用戶福利的雙重價(jià)值,“羊毛”薅不停。

百度果園在上線一段時(shí)間后,我們思考如何能進(jìn)一步豐富果園玩法,要幫助業(yè)務(wù)穩(wěn)定ROI,同時(shí)也要在用戶角度上玩的更加有趣。我們從體驗(yàn)、用戶、增長(zhǎng)3個(gè)角度進(jìn)行分析,為百度果園增加“道具”玩法:

  • 從體驗(yàn)角度上打造更加真實(shí)的種植體驗(yàn)趣味性,讓用戶感知更豐富的活動(dòng)玩法,并與用戶的核心訴求相匹配,通過澆水道具來幫助提升用戶的澆水效率、降低澆水難度;利用互動(dòng)道具增加自身收益,再留出其它能夠持續(xù)擴(kuò)展的方向讓百度果園的玩法更加豐富有趣;
  • 用戶角度上,幫助用戶更快實(shí)現(xiàn)自身領(lǐng)水果的目標(biāo);以及種樹人的路上永遠(yuǎn)不能孤單的互動(dòng)方式;
  • 業(yè)務(wù)增長(zhǎng)角度上,后續(xù)可以持續(xù)擴(kuò)展百度果園自身特色,持續(xù)把百度APP的服務(wù)、功能推薦給用戶,持續(xù)體驗(yàn)產(chǎn)品,增加百度APP的粘性。

結(jié)合百度果園自身可落實(shí)上,我們優(yōu)先在可以提升用戶澆水效率,幫助用戶快速拿水果的道具進(jìn)行試水,結(jié)合線下實(shí)際生活中的種植場(chǎng)景去思考,所以我們將道具名稱與玩法設(shè)定為「化肥」,在種植中增加化肥收益,提升果樹的種植進(jìn)度,讓百度果園在玩法上更加生活化。

圖片

新玩法上線后,通過上線提示引導(dǎo)用戶去使用道具,用戶進(jìn)入百度果園后先給到用戶一袋「化肥」來體驗(yàn)玩法,讓用戶快速感受到道具帶來的實(shí)際價(jià)值,從而建立信任。用戶使用道具后,果園主頁直接破殼「化肥」道具的狀態(tài),我們給到「化肥」道具3種狀態(tài)來描述使用情況;健康有活力的綠色狀態(tài)代表化肥的養(yǎng)分非常充足,果樹的成長(zhǎng)速度加倍;橙黃色代表果樹的生長(zhǎng)進(jìn)度欠佳,需要用戶關(guān)注;紅色狀態(tài)代表果樹缺少養(yǎng)分,需要用戶去使用新的「化肥」,并在紅色狀態(tài)下我們直接破殼使用引導(dǎo),直接提示用戶點(diǎn)擊。

圖片

 

三、后續(xù)發(fā)散

隨著百度果園的進(jìn)一步成長(zhǎng),能夠帶給用戶的不僅是“薅羊毛”類活動(dòng)的概念,百度果園也會(huì)繼續(xù)向帶有社會(huì)價(jià)值與故事性活動(dòng)內(nèi)容延伸,更多的去賦予精神意義與社會(huì)意義;我們后續(xù)也會(huì)持續(xù)打磨、持續(xù)平衡產(chǎn)品收益與用戶情緒的價(jià)值,不僅僅是在“薅羊毛”,更會(huì)讓每一次的澆水、施肥和每收到的一箱水果都有自己的含義。

圖片

 

寫在最后

增長(zhǎng)是產(chǎn)品商業(yè)化持續(xù)的目標(biāo),有了百度果園的經(jīng)驗(yàn)和設(shè)計(jì)思路,也為我們后續(xù)探索新的長(zhǎng)線活動(dòng)玩法提供了基礎(chǔ)和經(jīng)驗(yàn),我們的工作也將持續(xù)充滿著挑戰(zhàn)和更多樂趣。

 

作者:百度APP用戶體驗(yàn)

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》關(guān)于“薅羊毛”那些事兒——百度果園長(zhǎng)線活動(dòng)設(shè)計(jì)思考


藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




設(shè)計(jì)靈感不應(yīng)該被一個(gè)網(wǎng)站而限制

seo達(dá)人


不能被一個(gè)網(wǎng)站而限制

最近 Behance 封停了國(guó)內(nèi)賬號(hào),導(dǎo)致很多設(shè)計(jì)師無法訪問,因此也流傳了很多解決方案。今天黑馬哥就不和大家討論這個(gè)解決方案了,其實(shí)有很多同學(xué)就算在能訪問的時(shí)候也沒看幾次~O(∩_∩)O~。

圖片

這個(gè)事件告訴我們,設(shè)計(jì)師的習(xí)慣是多么的重要,我們的設(shè)計(jì)靈感不能因?yàn)橐粋€(gè)網(wǎng)站平臺(tái)而局限。退出賬號(hào)依然可以訪問,只是很多同學(xué)糾結(jié)的是自己的收藏沒有了,如果平時(shí)養(yǎng)成本地化采集的習(xí)慣,你就不會(huì)出現(xiàn)這個(gè)問題。我們不要把希望寄托在云端,只是買一個(gè)硬盤就能解決的事情,也不要覺得不方便,其實(shí)很多作品我們也不會(huì)經(jīng)???,存儲(chǔ)只是為了不時(shí)之需。每年都對(duì)采集的作品進(jìn)行一次整理,近兩年的放在電腦里面,時(shí)間過長(zhǎng)的存儲(chǔ)在硬盤里面就可以了。主要還是要對(duì)作品進(jìn)行分析,掌握作品的技法經(jīng)驗(yàn)和設(shè)計(jì)思維才是關(guān)鍵。

除了存儲(chǔ)習(xí)慣以外,我們也不要只是固定訪問一個(gè)網(wǎng)站獲取靈感,優(yōu)秀的設(shè)計(jì)類平臺(tái)是很多的,我們要發(fā)現(xiàn)更多新大陸。下面黑馬哥為大家精選幾個(gè)訪問頻次較高的國(guó)外平臺(tái),國(guó)內(nèi)的大家都比較熟悉這里就不列舉了。

 

設(shè)計(jì)/插畫等靈感網(wǎng)站推薦

以下推薦一些個(gè)人比較常用的幾個(gè)網(wǎng)站,排名不分先后,屬于隨機(jī)性排序。

1、notefolio

https://notefolio.net/

notefolio 是韓國(guó)的一個(gè)設(shè)計(jì)交流網(wǎng)站,很多設(shè)計(jì)師都會(huì)在這里分享自己的設(shè)計(jì)作品和進(jìn)行設(shè)計(jì)交流。和國(guó)內(nèi)很多設(shè)計(jì)作品分享平臺(tái)類似,是一個(gè)綜合型設(shè)計(jì)師交流社區(qū),有平面設(shè)計(jì)、UI/UX 設(shè)計(jì)、插畫、產(chǎn)品包裝設(shè)計(jì)、攝影、版式設(shè)計(jì)、數(shù)字藝術(shù)、美術(shù)、工藝等等。

圖片

 

2、Mobbin

https://mobbin.com/

這是一個(gè)匯集全球優(yōu)秀 APP 截圖的網(wǎng)站,有超過 50000 個(gè)優(yōu)秀 APP,節(jié)省了下載應(yīng)用的時(shí)間,對(duì)于 UI 設(shè)計(jì)師來說非常實(shí)用。

同樣的應(yīng)用還提供了 iOS 和 Android 兩個(gè)不同版本的截圖,簡(jiǎn)直非常的人性化。這是一個(gè)使用起來非常簡(jiǎn)單的網(wǎng)站,海量的設(shè)計(jì)必將開啟你的靈感腦洞。

圖片

 

3、Pinterest

https://www.pinterest.com/

這絕對(duì)是一個(gè)靈感采集的絕佳網(wǎng)站,經(jīng)過眾多用戶的長(zhǎng)期積累,已經(jīng)匯集了全球大量的優(yōu)質(zhì)圖片資源,其中設(shè)計(jì)作品也是非常豐富,且質(zhì)量都普遍偏高。

你可以通過關(guān)鍵詞搜索、畫板關(guān)注、以圖搜圖等操作獲得靈感,而且相似推薦還能延伸出更多類似構(gòu)圖、配色、主題等圖片資源。點(diǎn)擊作品還能跳轉(zhuǎn)到原始出處,順藤摸瓜找到更多優(yōu)質(zhì)資源,真的是非常便利。

圖片

 

4、Designspiration

https://www.designspiration.com/

該網(wǎng)站除了通過關(guān)鍵詞搜索圖片內(nèi)容以外,在搜索欄有?個(gè)調(diào)色板的圖標(biāo),點(diǎn)擊可以通過指定的顏色進(jìn)行搜索相關(guān)配色的圖片或者設(shè)計(jì)。在選擇顏色的時(shí)候不是單一的色彩選擇,可以選擇幾個(gè)配?組合進(jìn)行搜索,對(duì)于設(shè)計(jì)師來說?常實(shí)用。

圖片

 

5、Abduzeedo

https://abduzeedo.com/

Abduzeedo 是一個(gè)優(yōu)秀的設(shè)計(jì)博客,提供給設(shè)計(jì)師創(chuàng)意和靈感的社區(qū),這里有設(shè)計(jì)、攝影和 UX 等相關(guān)的文章提供給那些想尋找靈感的設(shè)計(jì)師。這是一個(gè)開放的設(shè)計(jì)社區(qū),它是設(shè)計(jì)師日常的靈感來源。

圖片

 

6、UI Garage

https://uigarage.net/

UI Garage 提供了很多應(yīng)用設(shè)計(jì)的截圖和模板,專業(yè)細(xì)分的類別和精挑細(xì)選的設(shè)計(jì)截圖,還有很多設(shè)計(jì)工具推薦,是一個(gè)非常實(shí)用的網(wǎng)站。在這里不僅可以獲得設(shè)計(jì)靈感,還能獲得優(yōu)秀的設(shè)計(jì)工具或者插件來提高我們的工作效率。

圖片

 

7、Dribbble

https://dribbble.com/

Dribbble 相信很多喜歡 UI 設(shè)計(jì)打卡的同學(xué)比較熟悉,匯集了大量設(shè)計(jì)師的一些日常創(chuàng)意作品。該網(wǎng)站不同之處是發(fā)布作品需要邀請(qǐng)碼,就是需要有邀請(qǐng)碼的設(shè)計(jì)師邀請(qǐng)加入才能發(fā)布作品,獲得邀請(qǐng)碼也相當(dāng)于設(shè)計(jì)能力獲得認(rèn)可。

整體作品的質(zhì)量還是不錯(cuò)的,如果當(dāng)你設(shè)計(jì)時(shí)沒有想法,這是一個(gè)不錯(cuò)的靈感采集地。

圖片

 

8、ndc

https://www.ndc.co.jp/works/

這個(gè)網(wǎng)站展示了很多非常不錯(cuò)的設(shè)計(jì)作品,偏向于簡(jiǎn)約風(fēng)。相信這些項(xiàng)目設(shè)計(jì)的靈感,可以帶給我們更多的設(shè)計(jì)思考。

圖片

 

9、FolioArt

https://folioart.co.uk/

FolioArt 是一個(gè)插畫藝術(shù)作品展示網(wǎng)站,擁有高質(zhì)量的插畫作品,形式也多種多樣。就像一個(gè)插畫家的資源庫(kù),讓有商業(yè)需求的客戶通過這個(gè)平臺(tái),和世界頂尖的插畫師進(jìn)行合作。

圖片

 

10、unDraw

https://undraw.co/illustrations

這里提供的插畫作品數(shù)量眾多,各種小場(chǎng)景的插畫無論是獨(dú)立使用,還是組合使用,肯定可以滿足很多場(chǎng)景需求了。平臺(tái)內(nèi)置的編輯器還可以對(duì)插畫進(jìn)行調(diào)色,導(dǎo)出格式也是支持后期編輯,非常的實(shí)用和便利。

圖片

 

小結(jié)

設(shè)計(jì)的靈感來源途徑是很多的,不局限于某一個(gè)單一路徑,以上的推薦僅為拋磚引玉,還有很多優(yōu)秀的網(wǎng)站給我們帶來設(shè)計(jì)靈感和經(jīng)驗(yàn)學(xué)習(xí)。每個(gè)人的關(guān)注焦點(diǎn)和選擇角度不同,以上僅為個(gè)人推薦,不足之處歡迎大家留言補(bǔ)充。


作者:黑馬青年

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》設(shè)計(jì)靈感不應(yīng)該被一個(gè)網(wǎng)站而限制

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



面對(duì)高速快跑的產(chǎn)品,如何優(yōu)雅推進(jìn)體驗(yàn)優(yōu)化

seo達(dá)人


 

圖片

或許你在推進(jìn)體驗(yàn)優(yōu)化時(shí),也遇到過以下困惑:“對(duì)于設(shè)計(jì)師走查出的體驗(yàn)問題,為什么PM總是間歇性視而不見?”“PM既然認(rèn)可了體驗(yàn)問題的重要性,但是他為什么總說放一放,過一段時(shí)間再整改呢?”

“排除萬難,體驗(yàn)問題終于提交了版本需求,為什么總是因優(yōu)先級(jí)不高,無法獲得充足的開發(fā)資源,順利上線呢?”

圖片

我們?cè)谶M(jìn)行趕集直招體驗(yàn)優(yōu)化過程中,也時(shí)常遇到這些困惑,究其原因,主要是因?yàn)椋?strong>我們作為設(shè)計(jì)師,每天所處的工作范圍和接觸到的信息有限,促使我們忽略了對(duì)產(chǎn)品階段的深入思考,誤以為PM對(duì)體驗(yàn)優(yōu)化和體驗(yàn)問題的理解,和我們高度一致。因此在著手進(jìn)行體驗(yàn)優(yōu)化前,我們要提升對(duì)產(chǎn)品階段的理解把握,知道所服務(wù)的產(chǎn)品處于哪個(gè)階段,產(chǎn)品發(fā)力方向是什么,進(jìn)而準(zhǔn)確找到體驗(yàn)優(yōu)化的推進(jìn)策略。

在不同產(chǎn)品階段(探索期、快速成長(zhǎng)期、成熟期),體驗(yàn)優(yōu)化的推進(jìn)策略也各不相同:

處于探索期的產(chǎn)品,其發(fā)力方向?yàn)轵?yàn)證業(yè)務(wù)模式。在這個(gè)從0-1的時(shí)期,其實(shí)不存在推進(jìn)體驗(yàn)優(yōu)化的概念,設(shè)計(jì)師應(yīng)盡可能進(jìn)行完善的基礎(chǔ)體驗(yàn)?zāi)芰ㄔO(shè),如沿用成熟規(guī)范與組件搭建產(chǎn)品體驗(yàn),后續(xù)伴隨產(chǎn)品核心功能、流程驗(yàn)證,同步迭代打磨;

處于快速成長(zhǎng)期的產(chǎn)品,其發(fā)力方向?yàn)榭焖倮峦亓?,縱向做好垂類。這個(gè)時(shí)期的體驗(yàn)優(yōu)化推進(jìn)策略是,基于產(chǎn)品功能迭代,進(jìn)行“小步快推”;

處于成熟期的產(chǎn)品,其發(fā)力方向?yàn)樘嵘脩艋钴S度,實(shí)現(xiàn)商業(yè)變現(xiàn)。這個(gè)時(shí)期更適合采取體驗(yàn)優(yōu)化專項(xiàng),推進(jìn)體驗(yàn)優(yōu)化。

圖片

可以看到,趕集直招目前處于“快速成長(zhǎng)期”,因此我們選擇了“小步快推”的策略。

 

圖片

找準(zhǔn)“小步快推”的推進(jìn)策略后,具體的執(zhí)行方法是什么呢?

辛向陽先生在《從物理邏輯到行為邏輯》一文中,提出了交互行為5要素的概念,即用戶、場(chǎng)景、目的、媒介與行為,以幫助設(shè)計(jì)師對(duì)問題進(jìn)行準(zhǔn)確解析和挖掘。

圖片

其實(shí)推進(jìn)體驗(yàn)優(yōu)化,本身也可以理解成是一次交互行為的設(shè)計(jì),因此在進(jìn)行趕集直招體驗(yàn)優(yōu)化初始,我們沿用了交互行為5要素的概念,對(duì)趕集直招進(jìn)行了解析,并挖掘出具體可執(zhí)行的方法。

用戶:幫助中國(guó)4億藍(lán)領(lǐng)找工作的趕集直招;

場(chǎng)景:服務(wù)業(yè)逐漸復(fù)蘇,趕集直招在市場(chǎng)上已經(jīng)被廣泛知曉和接受,市占率不斷上升;

目的:把控ROI前提下,一方面持續(xù)拓展用戶量,另一方面開始向商業(yè)化傾斜資源,謀求商業(yè)營(yíng)收;

媒介:趕集直招APP,每3周迭代1版;

行為:深耕細(xì)分市場(chǎng),不斷驗(yàn)證新的業(yè)務(wù)模式,優(yōu)化舊的業(yè)務(wù)模式,高速快跑與競(jìng)品拉開距離。

圖片

綜上,我們總結(jié)出了處于“快速成長(zhǎng)期”的趕集直招,3個(gè)顯著特征,和對(duì)應(yīng)的體驗(yàn)優(yōu)化執(zhí)行方法:

特征1:需求多而側(cè)重于垂類深耕→執(zhí)行方法:提前規(guī)劃,全局視野;

特征2:資源傾斜商業(yè)化→執(zhí)行方法:評(píng)估需求,整合策略;

特征3:版本迭代快→執(zhí)行方法:流程調(diào)整,需求擴(kuò)容。

 

圖片

提前規(guī)劃 全局視野

前期使用體驗(yàn)管理工具,收集了大量體驗(yàn)問題,我們對(duì)其進(jìn)行聚類整合,匯總成《趕集直招體驗(yàn)優(yōu)化問題池》,并與PM進(jìn)行對(duì)齊,探討優(yōu)化可能性。

圖片

該階段的keypoint是:對(duì)體驗(yàn)問題項(xiàng)進(jìn)行判斷,是進(jìn)行逐個(gè)優(yōu)化,還是合并成獨(dú)立需求,統(tǒng)一優(yōu)化。

 

評(píng)估需求 整合策略

承接需求時(shí),我們需要對(duì)需求類型進(jìn)行評(píng)估,趕集直招的需求通??煞譃?類:

第1類是重產(chǎn)品側(cè)解決的需求,通常這類需求范圍較明確,PM有較完整的解決方案;

第2類是重設(shè)計(jì)側(cè)解決的需求,這類需求范圍較開放,給設(shè)計(jì)師發(fā)揮的空間較大,我們?cè)谮s集直招體驗(yàn)優(yōu)化推進(jìn)中,主要錨定第2類需求。

在和PM了解需求背景和業(yè)務(wù)目標(biāo)后,則進(jìn)入解決策略梳理階段,通常PM會(huì)提出關(guān)于如何達(dá)成目標(biāo)的種種產(chǎn)品策略和部分設(shè)計(jì)策略,此時(shí)我們會(huì)站在用戶視角,從目標(biāo)出發(fā),果斷衡量出其策略的更多擴(kuò)展性,多維度思考,整合PM策略,并提出設(shè)計(jì)側(cè)的更全面的解決策略。

圖片

該階段的keypoint是:需與PM對(duì)齊一個(gè)思路,即體驗(yàn)的優(yōu)化與打磨也是達(dá)成業(yè)務(wù)目標(biāo)的重要策略之一。

 

流程調(diào)整 需求擴(kuò)容 

在推進(jìn)體驗(yàn)優(yōu)化的同時(shí),我們對(duì)設(shè)計(jì)側(cè)與產(chǎn)品側(cè)的合作流程,也在不斷努力做出調(diào)整,以便為體驗(yàn)優(yōu)化爭(zhēng)取更多打磨的窗口期。

調(diào)整前的合作流程,設(shè)計(jì)側(cè)作為產(chǎn)品側(cè)下游,在產(chǎn)品原型分發(fā)后才會(huì)接到設(shè)計(jì)需求,且排期極度緊張,這樣設(shè)計(jì)側(cè)的重點(diǎn)會(huì)被牽引到快速支持當(dāng)前需求,不利于體驗(yàn)優(yōu)化推進(jìn),為此我們與PMO、產(chǎn)品側(cè)積極溝通調(diào)整合作流程,設(shè)計(jì)側(cè)在產(chǎn)品需求內(nèi)審后就前置介入,與PM一同經(jīng)歷方案構(gòu)思、分發(fā)與評(píng)審流程,為體驗(yàn)優(yōu)化爭(zhēng)取到了足夠的窗期口。

圖片

此外,對(duì)于產(chǎn)品側(cè)中遠(yuǎn)期重點(diǎn)需求,我們會(huì)提前與PM對(duì)齊OKR,跳出版本節(jié)奏的限制,聯(lián)合多角色建立主題專項(xiàng),規(guī)劃整體項(xiàng)目計(jì)劃,在過程中,對(duì)涉及到的體驗(yàn)問題項(xiàng),作為項(xiàng)目計(jì)劃的一部分,進(jìn)行集中解決,這樣在PM撰寫需求文檔時(shí),就可以將體驗(yàn)問題項(xiàng)最大限度收入到需求范圍內(nèi)。

 

圖片

給大家展示兩個(gè)我們推進(jìn)過程中的小案例:

基于問題池中的首頁瓷片區(qū)體驗(yàn)問題項(xiàng),我們借著PM對(duì)瓷片區(qū)提出更換瓷片位內(nèi)容的機(jī)會(huì),將瓷片區(qū)的體驗(yàn)問題項(xiàng)一并推進(jìn)優(yōu)化,對(duì)樣式和文案進(jìn)行降噪處理,使其重要信息更清晰,數(shù)據(jù)也提升明顯。

圖片

推進(jìn)年久失修的深層級(jí)頁面體驗(yàn)優(yōu)化是難事,但跟業(yè)務(wù)目標(biāo)相關(guān)又對(duì)數(shù)據(jù)提升有幫助就會(huì)容易很多。PM給出的需求范圍和目標(biāo)是“通過調(diào)整關(guān)鍵字段,提升簡(jiǎn)歷預(yù)覽頁的感知度”,我們整合該頁面的問題池后,提出“感知度提升=關(guān)鍵字段調(diào)整+信息布局/按鈕/文案等體驗(yàn)層面優(yōu)化”,滿足需求的同時(shí),也推進(jìn)了體驗(yàn)問題項(xiàng)的解決。

圖片

通過“找準(zhǔn)推進(jìn)策略-挖掘執(zhí)行方法-推進(jìn)3步走”3個(gè)層面的努力,在高強(qiáng)度的版本節(jié)奏下,我們用短短半年的時(shí)間,就實(shí)現(xiàn)了《趕集直招體驗(yàn)優(yōu)化問題池》中,大部分問題項(xiàng)的優(yōu)化解決。從最終業(yè)務(wù)效果看,各項(xiàng)數(shù)據(jù)指標(biāo)均符合或超過先前的預(yù)期,用戶滿意度也得到大幅增長(zhǎng),達(dá)成了本次體驗(yàn)優(yōu)化的預(yù)期目標(biāo)。

圖片

 

圖片

總結(jié)一下,當(dāng)我們計(jì)劃對(duì)產(chǎn)品進(jìn)行體驗(yàn)優(yōu)化時(shí),不要急于啟動(dòng)。

首先,判斷產(chǎn)品當(dāng)前所處的階段,找準(zhǔn)推進(jìn)策略;

其次,通過交互行為5要素解析產(chǎn)品,挖掘體驗(yàn)優(yōu)化執(zhí)行方法;

最后,如果所服務(wù)的產(chǎn)品處于“高速快跑期”,可借鑒“推進(jìn)3步走“的方法進(jìn)行推進(jìn):

1.提前規(guī)劃,建立全局視野,與PM對(duì)齊,判斷體驗(yàn)問題項(xiàng),是進(jìn)行逐個(gè)優(yōu)化,還是合并成獨(dú)立需求,統(tǒng)一優(yōu)化;

2.承接需求時(shí),評(píng)估需求類型,對(duì)有設(shè)計(jì)發(fā)揮空間的需求,整合多維度策略,盡可能囊括體驗(yàn)問題項(xiàng)優(yōu)化;

3.適時(shí)對(duì)合作流程做出調(diào)整,當(dāng)前版本需求做到前置介入,中遠(yuǎn)期需求做到提前規(guī)劃與需求擴(kuò)容,最大限度完成體驗(yàn)問題項(xiàng)優(yōu)化。

圖片

最后,愿大家都能在體驗(yàn)優(yōu)化之路上優(yōu)雅前行。

 


作者:環(huán)鐵藝術(shù)家

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》面對(duì)高速快跑的產(chǎn)品,如何優(yōu)雅推進(jìn)體驗(yàn)優(yōu)化

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



超全面的設(shè)計(jì)底層理論,優(yōu)秀設(shè)計(jì)背后離不開這些(上)

seo達(dá)人


圖片

當(dāng)沒有認(rèn)知緊張時(shí),用戶心流才會(huì)發(fā)生。當(dāng)一個(gè)設(shè)計(jì)有效時(shí),你才能體驗(yàn)到認(rèn)知上的輕松。如果沒有,你的“心流狀態(tài)”就會(huì)中斷(稍后會(huì)詳細(xì)討論),讓我們陷入認(rèn)知緊張,于是“設(shè)計(jì)失敗了”。

當(dāng)基本設(shè)計(jì)原則被忽略時(shí),這種情況很容易發(fā)生,導(dǎo)致設(shè)計(jì)無法“整合”。這些基本原則包括:平衡性、一致性和視覺層次、負(fù)空間、接近性、對(duì)比、統(tǒng)一、一致性、配色方案和排版層次等方面。(彩云注:很多人看到這些以為自己都懂,但實(shí)際設(shè)計(jì)時(shí)犯錯(cuò)最多的也是這些問題)

從神經(jīng)科學(xué)的角度來說,當(dāng)一個(gè)設(shè)計(jì)起作用時(shí),我們會(huì)“感受到它”。其影響立竿見影。它發(fā)生在潛意識(shí)里,在一瞬間完成,是人的本能反應(yīng)。我們不需要把它放在顯微鏡下分析它。

優(yōu)秀設(shè)計(jì)以簡(jiǎn)潔和優(yōu)雅而引人注目。喬納森·伊夫(Jonathan Ive)和迪特爾·拉姆斯(Dieter Rams)都可以算作這種設(shè)計(jì)思想的擁躉。

人們常說,優(yōu)秀設(shè)計(jì)背后的工藝是無形的。然而,這不是隨機(jī)發(fā)生的。不管人們是否注意到,設(shè)計(jì)的背后是遵循著大量而嚴(yán)格的原理去執(zhí)行的。偉大的設(shè)計(jì)師不會(huì)在畫板上隨意地將各種元素組合在一起,這是有方法的。

圖片

為什么有些設(shè)計(jì)具有美的感受,而有些卻沒有

相反地,當(dāng)一項(xiàng)設(shè)計(jì)被認(rèn)為“有些地方不對(duì)勁”時(shí),人們就會(huì)下意識(shí)地覺得這個(gè)設(shè)計(jì)是有問題的。這樣的結(jié)果會(huì)給品牌或產(chǎn)品帶來不好的影響。當(dāng)一個(gè)高端或奢侈品品牌受到高度關(guān)注時(shí),這種影響尤其有害。這就是為什么你永遠(yuǎn)不會(huì)遇到設(shè)計(jì)不完美的香奈兒(Chanel)商店的原因。

“你對(duì)一件事的第一印象會(huì)建立起你隨后的觀念,如果一家公司在你看來不專業(yè),你可能會(huì)認(rèn)為他們做的其他事情都不專業(yè)?!狣aniel Kahneman,普林斯頓大學(xué)心理學(xué)教授

圖片

這不是一個(gè)精心制作的設(shè)計(jì),會(huì)導(dǎo)致認(rèn)知緊張。你會(huì)在這個(gè)網(wǎng)站上預(yù)訂你的行程嗎?

我們都同意上面是糟糕的設(shè)計(jì),就像建在沙子上的房子,一個(gè)忽視基本設(shè)計(jì)原則的設(shè)計(jì)將會(huì)崩潰。潛意識(shí)里,它會(huì)立即被認(rèn)為是破碎的,無論是視覺上、精神上和情感上。

人類的大腦是懶惰的、有偏見的,喜歡走捷徑。Daniel Kahneman稱之為“低維思維”。當(dāng)人們看到某種設(shè)計(jì)時(shí),它的“美學(xué)完整性”、視覺感知和神經(jīng)科學(xué)之間存在著相互關(guān)聯(lián)。

當(dāng)一個(gè)設(shè)計(jì)是合理的,換句話說,它是令人愉快的、有效的,我們會(huì)迅速、直觀的判斷它是合理的。我們的心率降低,多巴胺水平增加,會(huì)有一種幸福和平靜的感覺。這就像我們聽到舒緩的音樂,會(huì)沉浸在一種每時(shí)每刻的“心流狀態(tài)” 中?!霸谶@種狀態(tài)下,人們會(huì)專注于一項(xiàng)活動(dòng),其他一切似乎都不重要”——來自于一個(gè)心理學(xué)概念,由 Mihaly Csikszentmihalyi在他的暢銷書《心流:最佳體驗(yàn)的心理學(xué)》中寫道。

圖片

你更愿意住進(jìn)哪個(gè)房間?

 

設(shè)計(jì)原則在審美完整性中的作用

蘋果的人機(jī)界面指南(Apple’s Human Interface Guidelines)幾十年來一直在談?wù)摗懊缹W(xué)完整性”。它也可以被稱為“設(shè)計(jì)完整性”或“審美凝聚力”。

蘋果對(duì)美學(xué)完整性的定義是“當(dāng)一個(gè)設(shè)計(jì)的外觀和行為與其功能完美匹配時(shí)”(彩云注:我的理解就是所見即所得,符合用戶的心理預(yù)期)。換句話說,設(shè)計(jì)的構(gòu)成是產(chǎn)品的一個(gè)組成部分。我們將研究決定設(shè)計(jì)組合成敗的設(shè)計(jì)原則——更多的是關(guān)于 UI,而不是關(guān)于 UX。

美學(xué)完整性不僅僅是關(guān)于設(shè)計(jì)有多好看。它指的是具有明顯連貫性的設(shè)計(jì):有效的結(jié)構(gòu)和布局,是什么讓它產(chǎn)生效果。換句話說,它的元素在視覺層次、對(duì)齊、間距、平衡、對(duì)稱、重復(fù)、比例、強(qiáng)調(diào)、接近、對(duì)比、統(tǒng)一、一致性、配色、排版、負(fù)空間等方面都有出色的運(yùn)用,這里僅舉幾個(gè)例子。

這與“黃金比例”無關(guān),黃金分割不能解決問題。斐波那契數(shù)列螺旋沒那么玄乎,給設(shè)計(jì)師帶不來驚人的設(shè)計(jì)。

設(shè)計(jì)師們?cè)诎布惸取ぶ炖蚧蛎赡塞惿哪樕袭嫵鼋鹕菪螘r(shí)驚呼道:”果然是”黃金比例“(彩云注:但事實(shí)上有點(diǎn)故弄玄虛了)。當(dāng)然,自然界中確實(shí)有神圣幾何學(xué)(黃金比例,又稱斐波那契螺旋,是基于此),依賴“黃金螺旋”作為設(shè)計(jì)原則是一種謬論,它已被多次暴露在其赤裸裸的荒謬中。

圖片

這是我的洗衣機(jī),上面疊加了斐波那契螺旋。

“審美的完整性”不是沒道理的。這個(gè)概念是基于基本的設(shè)計(jì)原則,是有成就的設(shè)計(jì)師實(shí)踐他們的藝術(shù)作品的經(jīng)驗(yàn)總結(jié)。

讓我們來看看一些設(shè)計(jì)原則,以及它們?yōu)槭裁磿?huì)使得你的設(shè)計(jì)更能更加有效。通常情況下,真正優(yōu)秀的設(shè)計(jì)會(huì)結(jié)合這些設(shè)計(jì)原則。

 

我們將探討以下這些最底層的設(shè)計(jì)原理:

  • 視覺層次感
  • 間距、對(duì)齊和網(wǎng)格
  • 平衡
  • 對(duì)比
  • 對(duì)稱
  • 重復(fù)
  • 幾率原則和三分原則
  • 引導(dǎo)線
  • 比例
  • 強(qiáng)調(diào)
  • 整體性
  • 親密性
  • 一致性
  • 顏色
  • 排版
  • 負(fù)空間

 

一、視覺層次感

視覺感知的基本規(guī)則對(duì)任何視覺設(shè)計(jì)都是至關(guān)重要的,因?yàn)樗鼈冎笇?dǎo)著如何盡可能快地傳達(dá)信息。視覺層次是設(shè)計(jì)中信息的結(jié)構(gòu)和優(yōu)先級(jí)。它決定了人們接受和處理信息的順序,因?yàn)樗砸环N視覺方式引導(dǎo)他們。

視覺層次感重在打造視覺優(yōu)先級(jí)。通過巧妙地使用顏色、形狀、大小、間距、比例和方向,創(chuàng)造性地使用決定層次的視覺元素來傳達(dá)構(gòu)圖的意義、概念和情緒。

核心關(guān)注點(diǎn)是什么,你希望用戶首先注意到或開始閱讀的設(shè)計(jì)中最重要的元素是什么?我們想讓它成為焦點(diǎn),然后其他部分的設(shè)計(jì)從這里展開。

圖片

一個(gè)具有良好視覺層次的網(wǎng)站會(huì)引導(dǎo)用戶關(guān)注重要的部分

視覺層次對(duì)于每一種視覺設(shè)計(jì)都是至關(guān)重要的,無論是需要引導(dǎo)訪客眼球的首頁還是移動(dòng)端UI的導(dǎo)航入口。用戶對(duì)每個(gè)元素的理解取決于組合中的其他元素及其上下文。

建立視覺層次的一些技術(shù)是:位置、大小和比例、顏色和對(duì)比、間距和親密性、負(fù)空間、紋理、引導(dǎo)線和高度。在一個(gè)元素周圍使用豐富的負(fù)空間可以使它看起來更有意義。使用引導(dǎo)線可以創(chuàng)造移動(dòng),就像一個(gè)人的眼睛在設(shè)計(jì)上移動(dòng)一樣。排版的層次結(jié)構(gòu)也扮演著重要的角色,通過不同的大小和權(quán)重,我們可以讓更重要的文本元素脫穎而出并建立秩序。

加分技巧

  • 使用一個(gè)隱形三角形連接設(shè)計(jì)中的三個(gè)重點(diǎn)區(qū)域(構(gòu)圖)。
  • 注意古騰堡圖模式(Gutenberg Diagram)、F 模式(F-Pattern)、Z 模式(Z-Pattern)和層蛋糕模式(Layer Cake Pattern)的視覺掃描,并順應(yīng)趨勢(shì)而不是反對(duì)趨勢(shì)。(彩云注:這里的這些模式彩云就不過多介紹了,感興趣的可以自行了解下)

圖片

沒有視覺層次的網(wǎng)站沒有明顯的興趣點(diǎn)。

 

二、留白、對(duì)齊和網(wǎng)格

設(shè)計(jì)中的對(duì)齊和間距通過空間上的連接傳達(dá)出一種秩序和組織感,這兩個(gè)原則都在設(shè)計(jì)背后發(fā)揮重要價(jià)值。設(shè)計(jì)師早期學(xué)到的基本知識(shí)之一是在網(wǎng)格上編排設(shè)計(jì),然后對(duì)齊和分隔這些元素。

左對(duì)齊、居中對(duì)齊、右對(duì)齊都沒錯(cuò),但你必須對(duì)齊,否則當(dāng)元素沒有對(duì)齊時(shí),設(shè)計(jì)就會(huì)給人崩潰的感覺。它給人一種不安的感覺。

圖片

沒對(duì)齊的話,眼睛看著很難受

網(wǎng)格有很多不同的類型:列網(wǎng)格、基線網(wǎng)格、模塊網(wǎng)格、層次網(wǎng)格、像素網(wǎng)格等。不同設(shè)計(jì)使用不同網(wǎng)格,但最基本的是設(shè)計(jì)元素的對(duì)齊和間距。

圖片

(Illustration courtesy UX Engineer)

網(wǎng)格可以被打破。一個(gè)死板的構(gòu)圖可能會(huì)在視覺上無趣,除非一個(gè)元素從網(wǎng)格中脫穎而出。錯(cuò)位或“打破網(wǎng)格”是賦予元素更多視覺權(quán)重的一個(gè)機(jī)會(huì)。當(dāng)在設(shè)計(jì)中設(shè)置視覺層次結(jié)構(gòu)時(shí),它可以用來強(qiáng)調(diào)某些東西。

圖片

有時(shí)打破網(wǎng)格可以創(chuàng)造強(qiáng)調(diào)和移動(dòng)

 

三、平衡

設(shè)計(jì)上有兩種平衡:對(duì)稱和不對(duì)稱。所有的構(gòu)成元素:排版、顏色、圖像、形狀、圖案、留白等,都具有一定的視覺重量。有些元素很重,很吸引眼球,而有些元素很輕,感覺不那么重要。

這些元素的放置方式能夠在對(duì)稱設(shè)計(jì)中創(chuàng)造出一種平等的順序感,或者一種稍微偏離平衡能夠創(chuàng)造出一種不對(duì)稱的設(shè)計(jì)。無論對(duì)稱還是不對(duì)稱,我們的大腦都被某種平衡感所吸引,因?yàn)樗鼊?chuàng)造了和諧、秩序和美學(xué)上令人愉悅的結(jié)果。

圖片

多重原則:平衡、對(duì)齊和對(duì)稱在網(wǎng)站上發(fā)揮作用

 

四、對(duì)比

“對(duì)比”指的是使設(shè)計(jì)中不同的元素更容易區(qū)別開。強(qiáng)烈的對(duì)比可以在設(shè)計(jì)中強(qiáng)調(diào)一個(gè)區(qū)域,而微弱的對(duì)比可以弱化它,創(chuàng)造一個(gè)視覺層次。對(duì)比在設(shè)計(jì)中也扮演著重要的角色。對(duì)比不足會(huì)使文字特別難以閱讀,尤其是對(duì)視力有障礙的人來說。

圖片

在左邊的設(shè)計(jì)中,一些文字和背景之間的對(duì)比不夠。

Web內(nèi)容可訪問性指南 (WCAG)呼吁“文本的視覺呈現(xiàn)應(yīng)該有至少4.5:1的對(duì)比度”,除了大規(guī)模文本,它應(yīng)該有至少3:1的對(duì)比度。因此,設(shè)計(jì)師需要確保內(nèi)容保持舒適易讀。

其他UI元素(如各種顯示器和設(shè)備上的卡片、按鈕、文字和圖標(biāo))之間的適當(dāng)對(duì)比也是必須的。如果UI元素之間沒有明顯的區(qū)分度,設(shè)計(jì)就容易產(chǎn)生混亂。

 

五、對(duì)稱

在格式塔原理中,對(duì)稱和秩序的法則也被稱為pr?gnanz,德語單詞“好身材”的意思。這個(gè)原理說的是,大腦會(huì)以盡可能簡(jiǎn)單的方式感知模糊的形狀,這都是為了節(jié)省大腦能量。

我們傾向于尋找一切事物的對(duì)稱性。幾項(xiàng)研究發(fā)現(xiàn),面部對(duì)稱能提高人們對(duì)人臉吸引力的評(píng)價(jià)(盡管完全對(duì)稱的臉其實(shí)并不一定那么有吸引力)。該理論認(rèn)為,這種偏好與選擇DNA最好的伴侶的進(jìn)化優(yōu)勢(shì)有關(guān)。

對(duì)稱在自然界中也無處不在??纯匆恢缓?,一朵花,或者一只海星。

圖片

對(duì)稱

同樣的原理也適用于數(shù)字領(lǐng)域,平衡對(duì)稱的設(shè)計(jì)更令人愉悅。

圖片

對(duì)稱性在應(yīng)用中發(fā)揮作用。Uber Eats、Booking.com和Behance。

 

六、重復(fù)

重復(fù)是一致性的近親,是優(yōu)秀可用性的標(biāo)志。

在設(shè)計(jì)中利用重復(fù)是件好事,因?yàn)槲覀兊拇竽X總是在尋找模式、相似性和一致性。為什么?因?yàn)橹貜?fù)相同性質(zhì)的元素需要更少的認(rèn)知努力。

我們更容易識(shí)別重復(fù)的模式,而不是每次看到新模式都要重新校準(zhǔn)大腦。正如前面提到的,大腦作為一種生存機(jī)制是懶惰的,模式識(shí)別和認(rèn)知捷徑意味著有意識(shí)地處理視覺信息所需的能量更少。

例如,重復(fù)元素的形狀和大小、填充、留白、類型和顏色,也有助于更對(duì)稱、更好地平衡,做出美觀的設(shè)計(jì)。

圖片

The Athletic這個(gè)軟件就是用重復(fù)元素做設(shè)計(jì)的好例子。

好了,為了照顧大家的閱讀體驗(yàn),再寫更多估計(jì)有很多人要開始沒耐心了。所以剩下的設(shè)計(jì)原則,我們下回再接著聊,敬請(qǐng)關(guān)注哈。

 

原文:https://uxdesign.cc/design-principles-why-a-design-works-a572c5d2d92d

作者:Miklos Philips

譯者:彩云Sky

本文翻譯已獲得作者的正式授權(quán)(授權(quán)截圖如下)

圖片

 

作者:彩云Sky

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》超全面的設(shè)計(jì)底層理論,優(yōu)秀設(shè)計(jì)背后離不開這些(上)

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



蘋果設(shè)計(jì)為什么顯得高級(jí)?

seo達(dá)人


 一、什么是極簡(jiǎn)主義風(fēng)格 

圖片

在上世紀(jì)初期,隨著工業(yè)制造體系的變革,人們也開始尋找更適合工業(yè)化生產(chǎn)的設(shè)計(jì)方法與審美體系,極簡(jiǎn)的設(shè)計(jì)風(fēng)格便應(yīng)運(yùn)而生。在今天,極簡(jiǎn)主義早已演變成了一種潮流、一種文化,甚至是一種生活方式,成為了當(dāng)今的主流設(shè)計(jì)風(fēng)格。而它的設(shè)計(jì)理念大家應(yīng)該都知道——“少即是多”。說到這里就不得不提一個(gè)名字——蘋果。它可以說是數(shù)字設(shè)計(jì)中極簡(jiǎn)主義的先驅(qū),也是這種設(shè)計(jì)理念的貫徹者。

圖片

極簡(jiǎn)主義在設(shè)計(jì)上使用簡(jiǎn)單的元素,突出核心內(nèi)容。不但可以提升層次感,滿足設(shè)計(jì)需求,也能幫助用戶快速聚焦核心部分,突出主要功能。極簡(jiǎn)主義現(xiàn)在被廣泛應(yīng)用在UI、平面、品牌、工業(yè)設(shè)計(jì)等領(lǐng)域中,也在漸漸影響著人們的生活。

 

二、極簡(jiǎn)主義的特點(diǎn) 

圖片

那么極簡(jiǎn)主義有哪些特點(diǎn)呢?我們可以一起來看看:

1.大量的留白

2.運(yùn)用柵格來規(guī)整元素

3.簡(jiǎn)化配色

4.突出內(nèi)容

5.可讀性較高的字體

接下來就舉例說明這些特點(diǎn)。

 

1、大量的留白

在極簡(jiǎn)主義當(dāng)中,留白是必不可少的部分??赡苡械耐瑢W(xué)或認(rèn)為留白就是白色,其實(shí)留白并不一定是白色,它可以是任何與背景相同的色彩。留白在視覺上可以營(yíng)造平衡感,創(chuàng)造視覺焦點(diǎn),將核心內(nèi)容突出。通過這種方式讓用戶只關(guān)注必要的信息,只做必要的事情。

圖片

上圖就是運(yùn)用留白設(shè)計(jì)的品牌網(wǎng)站首頁,通過留白直接突出主體,用戶即使不認(rèn)識(shí)這個(gè)品牌也知道這是一個(gè)關(guān)于手表的網(wǎng)頁。

圖片

上圖就不是運(yùn)用白色進(jìn)行留白的網(wǎng)頁設(shè)計(jì),依然可以突出主要信息。留白在使用中,一定要注意構(gòu)圖的關(guān)系,使頁面整體保持平衡感。

 

2、利用柵格來規(guī)整元素

在極簡(jiǎn)主義設(shè)計(jì)風(fēng)格中,柵格系統(tǒng)可以讓簡(jiǎn)單的設(shè)計(jì)更有條理。運(yùn)用在頁面中,使信息和元素的展示更有邏輯性和規(guī)律性,使用戶查閱更順暢,也能使用戶從中更好的識(shí)別出主體內(nèi)容。設(shè)計(jì)師運(yùn)用柵格系統(tǒng)可以把有限的元素在整個(gè)空間中建立正確的層級(jí)性與關(guān)系,使整個(gè)設(shè)計(jì)更自然。

圖片

上面網(wǎng)頁就是運(yùn)用了柵格系統(tǒng)進(jìn)行布局,從圖片到標(biāo)題、文案都保持精準(zhǔn)的柵格化的對(duì)齊,使整個(gè)頁面都保持了協(xié)調(diào)感,使用戶在閱讀上也能遵循一定的規(guī)律與節(jié)奏。

圖片

如上圖即使是再簡(jiǎn)單的頁面,通過柵格系統(tǒng)也能使整個(gè)設(shè)計(jì)保持一定的協(xié)調(diào)性。

 

3、簡(jiǎn)化配色

極簡(jiǎn)主義在配色的選擇上,像黑白這樣的色調(diào)在表現(xiàn)上更中性,更能體現(xiàn)產(chǎn)品的功能性,而且會(huì)給人干凈并且富有秩序感的視覺感受。但是黑白并不是唯一的選擇,通常會(huì)選擇一種飽和度較低的單色作為主色調(diào),然后選取一到兩種點(diǎn)綴用來提亮貫穿整個(gè)設(shè)計(jì),達(dá)到提升視覺層次感的效果。

圖片

圖片

上面的兩張圖在配色上除了經(jīng)典的黑白色之外,還采用紅色作為點(diǎn)綴色,并且貫穿了整個(gè)設(shè)計(jì)。整體的配色不僅簡(jiǎn)潔而且體現(xiàn)出了層次感。

 

4、突出內(nèi)容

設(shè)計(jì)的初衷本來就是對(duì)內(nèi)容的設(shè)計(jì),所以突出內(nèi)容就是極簡(jiǎn)主義設(shè)計(jì)最為核心的特點(diǎn)之一。因?yàn)槠浜?jiǎn)約的設(shè)計(jì),可以讓用戶在第一時(shí)間就聚焦于內(nèi)容而不是頁面其他元素,而且內(nèi)容本身也可以當(dāng)做元素進(jìn)行設(shè)計(jì),強(qiáng)化視覺效果,讓畫面擁有視覺沖擊力與張力。

圖片

圖片

上面幾張圖就摒棄了其他元素,直接突出內(nèi)容讓受眾第一時(shí)間就關(guān)注內(nèi)容本身。

 

5、可讀性較高的字體

極簡(jiǎn)主義設(shè)計(jì)希望元素清晰易于辨認(rèn),對(duì)字體也是同樣的要求。

無論是襯線體還是非襯線體,一定要確保字體的可讀性,方便用戶快速感知文字內(nèi)容。在風(fēng)格上不要裝飾性太強(qiáng),使用經(jīng)典的字體就很好,在某種情況下適當(dāng)?shù)姆糯笞煮w,確保用戶可以一目了然更能突出設(shè)計(jì)的簡(jiǎn)潔、直觀。

圖片

圖片

在上面幾張圖中,無論是襯線還是非襯線字體,都會(huì)利用文字大小和適當(dāng)間距保證文字的可讀性,也不會(huì)對(duì)文字添加過多的裝飾性元素。

 

三、極簡(jiǎn)主義在設(shè)計(jì)中如何使用 

1、移動(dòng)端中的使用

圖片

圖片

圖片

上面幾張移動(dòng)端的界面,基本上都是有一個(gè)主要的色調(diào)+圖片+大標(biāo)題,以內(nèi)容為主體加上大量的留白,整體都符合極簡(jiǎn)主義的核心特點(diǎn)。

 

2、網(wǎng)頁中的使用

圖片

圖片

圖片

上面這組網(wǎng)頁設(shè)計(jì),也是采用了大標(biāo)題+產(chǎn)品精修圖+單一色調(diào)的背景進(jìn)行設(shè)計(jì),摒棄了裝飾性的元素,以突出內(nèi)容為主,運(yùn)用柵格進(jìn)行布局加大面積的留白,使頁面在簡(jiǎn)約的同時(shí)體現(xiàn)了統(tǒng)一與品質(zhì)。

 

3、品牌中的使用

圖片

上圖就是我們熟知的YouTube,這些年品牌逐步摒棄了一些高光、漸變、投影等裝飾性元素,并且加入了播放按鍵圖標(biāo),向用戶傳達(dá)了YouTube的主要業(yè)務(wù)方向,整個(gè)設(shè)計(jì)更加簡(jiǎn)約且一目了然。

圖片

上圖Instagram的logo也是向著極簡(jiǎn)的方向發(fā)展。新版logo只保留了老版相機(jī)的特征以及彩虹色的背景,突出主要元素特征,既簡(jiǎn)約又易于辨認(rèn)。

 

4、海報(bào)中的使用

圖片

圖片

上面幾張海報(bào)就是以圖片或者某一獨(dú)特圖形作為主體內(nèi)容進(jìn)行突出設(shè)計(jì),再加上文字與適當(dāng)?shù)牧舭走M(jìn)行柵格化的設(shè)計(jì),很好的體現(xiàn)了極簡(jiǎn)主義的設(shè)計(jì)風(fēng)格。

 

5、產(chǎn)品設(shè)計(jì)中的使用

圖片

圖片

運(yùn)用簡(jiǎn)約的設(shè)計(jì)語言,突出產(chǎn)品特性與功能性。富有美感與品質(zhì)性。

 

四、如何打造極簡(jiǎn)主義風(fēng)格 

看了這么多案例,是不是對(duì)如何進(jìn)行極簡(jiǎn)主義風(fēng)格設(shè)計(jì)還是有點(diǎn)不知所措,那么我將從圖形、配色、構(gòu)成、字體這幾個(gè)緯度來給大家闡述如何進(jìn)行極簡(jiǎn)主義風(fēng)格設(shè)計(jì)。

圖形:簡(jiǎn)單的幾何圖形,扁平化的設(shè)計(jì),去除裝飾性元素

圖片

上面的圖就是運(yùn)用簡(jiǎn)單的幾何圖形+扁平的設(shè)計(jì),突出內(nèi)容引導(dǎo)用戶進(jìn)行操作。

配色:以黑白灰為主,或者選取一種主色調(diào)加一到兩種點(diǎn)綴色

圖片

圖片

上面兩張圖第一張就是典型的黑白灰的配色,突出內(nèi)容,給人干凈和平靜秩序的感受,而第二張圖就是選用黃色為主色調(diào),然后其他顏色為點(diǎn)綴色,突出功能具有引導(dǎo)性。

構(gòu)成:大量的留白與柵格化的構(gòu)成形式

圖片

上圖就是利用留白與柵格來進(jìn)行頁面的布局,大留白突出重點(diǎn)內(nèi)容,柵格化的構(gòu)圖讓設(shè)計(jì)更具有協(xié)調(diào)性。

字體:非襯線體

圖片

雖然襯線字體也能體現(xiàn)出極簡(jiǎn)主義的風(fēng)格,但是非襯線體在視覺上更簡(jiǎn)潔,在突出品牌上辨識(shí)度更高。

 

五、極簡(jiǎn)主義配色 

設(shè)計(jì)中較重要的一環(huán)就是配色,下面我給大家分享幾組極簡(jiǎn)主義色彩搭配,每組都有色彩風(fēng)格對(duì)應(yīng)的形容詞和配色數(shù)值,希望給大家?guī)盱`感。

關(guān)鍵詞:自然,寧?kù)o,沿海和平衡

圖片

關(guān)鍵詞:女性化,誘人,寧?kù)o和熱愛

圖片

關(guān)鍵詞:大膽,自信,好玩和活力

圖片

關(guān)鍵詞:中性,平衡,寧?kù)o和時(shí)尚

圖片

關(guān)鍵詞:舒適,寧?kù)o,善良和原始

圖片

 

六、最后 

圖片

圖片

上面介紹了這么多,那么極簡(jiǎn)主義最核心的特點(diǎn)就是:以展示內(nèi)容為主,去除了多余的元素、顏色,完全體現(xiàn)了“少即是多”的設(shè)計(jì)理念。極簡(jiǎn)主義之所以受歡迎并且流行至今的一個(gè)原因就在于它突顯內(nèi)容,為用戶呈現(xiàn)最重要的東西,讓用戶關(guān)注最主要的事情,簡(jiǎn)化了界面使其更具功能與可行性。

我們做設(shè)計(jì)歸根結(jié)底也是在為內(nèi)容、商業(yè)服務(wù),而極簡(jiǎn)主義真正做到了內(nèi)容至上,但是要想更好的為商業(yè)服務(wù)其背后一定是經(jīng)過了深思熟慮的,就像小米新Logo一樣,看似簡(jiǎn)單必定是由繁到簡(jiǎn)的一個(gè)過程,而極簡(jiǎn)主義也是去除多余元素化繁為簡(jiǎn)的。所以與其說極簡(jiǎn)主義是一種設(shè)計(jì)風(fēng)格,不如說它更像我們想追求的化繁為簡(jiǎn)的生活方式。

 作者:三木

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》蘋果設(shè)計(jì)為什么顯得高級(jí)?


藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




數(shù)字化轉(zhuǎn)型時(shí)代下的設(shè)計(jì):醫(yī)療x數(shù)字孿生

seo達(dá)人


一、疫情之下我們能做些什么?

2019年底新冠疫情在國(guó)內(nèi)出現(xiàn),傳播范圍也隨著大量人口流動(dòng)加速蔓延。新冠疫情爆發(fā)讓我國(guó)疾控部門開始對(duì)重大突發(fā)事件的應(yīng)對(duì)能力、疾控水平逐漸重視起來。作為阿里云產(chǎn)業(yè)智能的設(shè)計(jì)師,也希望通過阿里云的數(shù)據(jù)與技術(shù)能力,在疫情之下找到自己的答案。

 

1、要解決什么問題?

為了熟悉疾控業(yè)務(wù)場(chǎng)景、流程、難點(diǎn)及其中涉及到的產(chǎn)品與技術(shù)訴求,我們走訪了省疾控中心信息中心。通過走訪我們發(fā)現(xiàn),打通業(yè)務(wù)鏈路并為居民和醫(yī)院提供幫助是疾控中心亟待實(shí)現(xiàn)的目標(biāo)。在傳染病監(jiān)測(cè)預(yù)警中,涉及多維數(shù)據(jù)收集與分析,數(shù)據(jù)來源不僅包括醫(yī)療機(jī)構(gòu)、流調(diào)數(shù)據(jù)、各類聚集性場(chǎng)所、交通工具等,環(huán)境數(shù)據(jù)的監(jiān)測(cè)對(duì)研判傳染病的源頭與傳播途徑也至關(guān)重要。

經(jīng)過調(diào)研和梳理,我們拆解出3個(gè)主要痛點(diǎn)及目標(biāo):

圖片

 

2、用戶是誰?

要解決疫情場(chǎng)景下的痛點(diǎn),就需要明確我們是為”誰“在解決問題。疾控業(yè)務(wù)主要面向疾控中心與衛(wèi)健委主管疾控的部門的工作人員,服務(wù)的對(duì)象則是每一個(gè)生活在城市里的你我他。管理部門需要對(duì)服務(wù)提供方進(jìn)行監(jiān)管,提供物資調(diào)配與診療輔助,對(duì)所有其他對(duì)象收集數(shù)據(jù)、發(fā)布預(yù)警、政策,對(duì)病例與密切接觸者進(jìn)行流行病調(diào)查。服務(wù)提供方和服務(wù)對(duì)象需要向管理方同步就診數(shù)據(jù)與異常情況。所有對(duì)象及其之間的關(guān)聯(lián),則是推演研判的重要依據(jù)。

 

二、為什么通過數(shù)字孿生緩解這些痛點(diǎn)?

人類歷史上,傳染病對(duì)人和區(qū)域帶來的影響是難以控制的、深遠(yuǎn)的、不可逆的,而防控與治療措施的研究制定是高難度、高風(fēng)險(xiǎn)、低容錯(cuò)的。數(shù)字孿生體可以讓疾控分析工作在一個(gè)與物理實(shí)體相映射的虛擬實(shí)體上開展,基于物理空間當(dāng)前與歷史數(shù)據(jù),在數(shù)字空間中通過全維度的數(shù)據(jù)監(jiān)測(cè)和反復(fù)推演研判,找到并驗(yàn)證疫情傳播發(fā)展的規(guī)律,以仿真、可控、低風(fēng)險(xiǎn)、高靈活度的方式進(jìn)行模擬預(yù)測(cè),提前識(shí)別未來可能發(fā)生的風(fēng)險(xiǎn)。從虛擬空間回到物理世界,對(duì)真實(shí)空間可以進(jìn)行精準(zhǔn)有效的「反控」,在最合適的時(shí)間,對(duì)最合適的對(duì)象,采取最合適的疫情防控措施。

從客戶、媒介、技術(shù)角度,為疾控部門提供綜合性的解決方案:

政府- 識(shí)別風(fēng)險(xiǎn)、提前干預(yù)

疫情動(dòng)態(tài)監(jiān)測(cè)和趨勢(shì)推演,找出變化規(guī)律,盡早識(shí)別風(fēng)險(xiǎn);給出防控處置措施建議,提前儲(chǔ)備資源,提高常態(tài)化疫情防控效率與能力。

公眾 – 信息平等與信任

預(yù)警傳染病危險(xiǎn)因素,將健康教育建議精準(zhǔn)推送給公眾,促進(jìn)信息對(duì)等,加強(qiáng)公眾的安全感和對(duì)政府的信任。

醫(yī)院 – 改善診療能力

通過風(fēng)險(xiǎn)提示和診療推薦,改善醫(yī)生診療能力,優(yōu)化醫(yī)療資源的分配。

技術(shù) – 數(shù)字孿生

通過靈活可控和相對(duì)低風(fēng)險(xiǎn)的方式,在虛擬空間中開展多點(diǎn)觸發(fā)的疾控模擬分析和風(fēng)險(xiǎn)預(yù)測(cè),形成突顯數(shù)據(jù)智能特點(diǎn)、客戶可感知的數(shù)字孿生能力解決方案,提升產(chǎn)品競(jìng)爭(zhēng)優(yōu)勢(shì)。

產(chǎn)品 – 形態(tài)創(chuàng)新

根據(jù)客戶真實(shí)訴求,通過數(shù)字技術(shù)打造多端聯(lián)動(dòng)的產(chǎn)品方案,拓展產(chǎn)品類型與創(chuàng)新機(jī)會(huì)。

圖片

綜上,我們結(jié)合客戶價(jià)值挖掘出設(shè)計(jì)機(jī)會(huì)點(diǎn):

圖片

 

三、構(gòu)建疾控體系化構(gòu)建數(shù)字孿生設(shè)計(jì)方案

對(duì)客戶和用戶大量的調(diào)研后,對(duì)訴求進(jìn)行歸納聚類,提煉為環(huán)境監(jiān)測(cè) –> 推演研判 –> 預(yù)警防控這三大主要模塊。

 

1、交互設(shè)計(jì)

對(duì)上述場(chǎng)景中涉及到的數(shù)據(jù)進(jìn)行收集分類,可以分為面向政府監(jiān)管 G 端、醫(yī)療機(jī)構(gòu) B 端與居民 C 端的數(shù)據(jù),根據(jù)業(yè)務(wù)目標(biāo)與描述對(duì)象性質(zhì),選取不同的可視化呈現(xiàn)方式。在與業(yè)務(wù)和算法同學(xué)溝通過程中,根據(jù)傳染病動(dòng)力學(xué)模型確定設(shè)計(jì)方案中影響因子的選取與交互設(shè)計(jì)方案。從用戶使用產(chǎn)品的場(chǎng)景出發(fā),我們?cè)谕蒲葸壿嬌喜捎谩刚蛲蒲荨购汀改嫦蛲蒲荨瓜嘟Y(jié)合的方式。

正向推演

當(dāng)用戶知道影響疫情的關(guān)鍵因素時(shí),用戶可以從影響因子出發(fā),選擇相關(guān)因素并指定作用對(duì)象或范圍,調(diào)整參數(shù)進(jìn)行仿真模擬,對(duì)推演結(jié)果進(jìn)行時(shí)間空間維度的對(duì)比。

逆向推演

當(dāng)用戶明確了疫情管控目標(biāo),例如需要在3天內(nèi)控制住疫情蔓延??梢圆捎媚嫦蛲蒲莸姆绞剑O(shè)置限定條件,通過知識(shí)圖譜展現(xiàn)影響因子和目標(biāo)元素之間的關(guān)聯(lián)要素(即隱性影響因素),計(jì)算達(dá)到目標(biāo)所需要的條件,即可得出精準(zhǔn)高效的措施建議。

圖片

在設(shè)計(jì)影響因子相關(guān)交互操作時(shí),我們結(jié)合傳染病相關(guān)專業(yè)知識(shí)與涉眾分析中的各類對(duì)象及其關(guān)系,盡量充分考慮社會(huì)、人文、自然等多維度要素,提供更多維度的調(diào)參可能。

利用數(shù)字孿生核心技術(shù),推導(dǎo)整體解決方案。

 

2、結(jié)合孿生亮點(diǎn),推導(dǎo)整體方案

在環(huán)境監(jiān)測(cè)場(chǎng)景中可以基于數(shù)字孿生對(duì)疫情傳播風(fēng)險(xiǎn)盡早識(shí)別,將監(jiān)控關(guān)口前移。在模擬推演中,我們利用數(shù)字孿生,將來多維因素在區(qū)域地圖上整合起來,力求充分考慮各類因素的動(dòng)態(tài)變化對(duì)疾病傳播的影響。由此,環(huán)境監(jiān)測(cè)與仿真模擬作為數(shù)字孿生能力與疾控工作的契合點(diǎn),成為重點(diǎn)優(yōu)化交互方式、打磨各方面體驗(yàn)、提升客戶與業(yè)務(wù)價(jià)值的突破口。

圖片

 

四、醫(yī)療數(shù)字孿生:沙盤推演 + 微鏡探查

我們?cè)诋a(chǎn)品/大屏側(cè)從兩個(gè)創(chuàng)新出點(diǎn)出發(fā),提煉出沙盤推演+微鏡探查的概念方案。

 

1、沙盤推演

按比例還原并模擬疫情發(fā)生區(qū)域的自然環(huán)境、天氣因素、社會(huì)因素、人口因素、與社會(huì)因素。通過電腦端調(diào)整疫情影響因素,在沙盤中觀察疫情對(duì)地區(qū)生態(tài)/人文/社會(huì)等方面的影響。

微鏡探查

將產(chǎn)品類比成洞察疫情發(fā)展的顯微鏡,用戶通過上帝視角在產(chǎn)品中模擬探查不同因素對(duì)疫情發(fā)展產(chǎn)生的影響,對(duì)未來的疫情起到趨勢(shì)研判的效果。

圖片

圖片

圖片

 

五、不斷探索,積極前行

作為數(shù)據(jù)智能與數(shù)字行業(yè)設(shè)計(jì)師,我們希望利用專業(yè)做出盡管可能微小但積極的改變,為業(yè)務(wù)、行業(yè)和社會(huì)帶來一些價(jià)值。在公共衛(wèi)生領(lǐng)域,我們不斷在社會(huì)意義、客戶與用戶訴求、業(yè)務(wù)目標(biāo)之間尋找契合點(diǎn),探索數(shù)字孿生體驗(yàn)設(shè)計(jì)的突破口。疾控工作涉及到的公共衛(wèi)生與醫(yī)療知識(shí)、倫理抉擇、社會(huì)關(guān)系、經(jīng)濟(jì)利益等交織在一起,極度復(fù)雜;但希望通過在行業(yè)轉(zhuǎn)型過程中加入數(shù)字孿生體驗(yàn)設(shè)計(jì)的視角與方法,最終可以在促進(jìn)疾病預(yù)防、公共衛(wèi)生資源分配平衡,改善全民健康、生活質(zhì)量與社會(huì)公平信任的艱巨道路上,增加一點(diǎn)點(diǎn)推動(dòng)的力量。

 

特別鳴謝:項(xiàng)目成員
數(shù)字醫(yī)療團(tuán)隊(duì)pd:達(dá)蓬 、基岡 、蔣夢(mèng)華

數(shù)字醫(yī)療研發(fā)算法:延妮
阿里云設(shè)計(jì)中心設(shè)計(jì)師:項(xiàng)婉 、指耘、六衣


作者: 阿里云設(shè)計(jì)中心

轉(zhuǎn)載請(qǐng)注明:學(xué)U網(wǎng)》數(shù)字化轉(zhuǎn)型時(shí)代下的設(shè)計(jì):醫(yī)療x數(shù)字孿生

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




如何讓你的設(shè)計(jì)看起來更有說服力?試試網(wǎng)格系統(tǒng)!

seo達(dá)人


一、網(wǎng)格系統(tǒng)的組成

在深入了解網(wǎng)格的類型和使用準(zhǔn)則前,讓我們先來了解一下網(wǎng)格系統(tǒng)中涉及到的一些基本概念,比如列數(shù)、內(nèi)邊距、外邊距等等。

1、列

圖片

列(Column)是網(wǎng)格的基礎(chǔ),用來表示內(nèi)容放置的區(qū)域。每一列的寬度以百分比而不是固定的數(shù)值來衡量,這樣面對(duì)不同的屏幕尺寸,可以更靈活地進(jìn)行設(shè)計(jì)。

日常設(shè)計(jì)中,最常使用的是12列等寬的網(wǎng)格系統(tǒng),適用于大多數(shù)的頁面和布局設(shè)計(jì)中。

2、內(nèi)間距

圖片

內(nèi)間距(Gutter/Padding)是指每列之間的距離,也被叫做水槽。內(nèi)間距能為頁面提供呼吸空間,避免內(nèi)容之間過于擁擠。

3、外邊距

圖片

邊距(Margins)是列與邊框之間的距離,邊距繞過內(nèi)容有上、下、左、右四個(gè)方向,在設(shè)計(jì)中我們可以針對(duì)每一側(cè)設(shè)定和更改邊距。

4、字段或模塊

圖片

字段或模塊是行和列的交集。這些模塊是頁面的基礎(chǔ),所有設(shè)計(jì)元素都將適合網(wǎng)格中矩形卡片創(chuàng)建的這些空間單元。

5、界面設(shè)計(jì)與網(wǎng)格

如果說網(wǎng)格在過去對(duì)于印刷必不可少,那么今天網(wǎng)格在數(shù)字世界中仍是不可或缺的。

圖片

網(wǎng)格成為開發(fā)數(shù)字產(chǎn)品的關(guān)鍵工具,為在所有設(shè)備上提供最佳的用戶體驗(yàn)。因此,無論屏幕大小如何,設(shè)計(jì)師都必須能夠在每個(gè)屏幕上通過最佳的方式組織內(nèi)容。

 

二、如何在設(shè)計(jì)中使用網(wǎng)格系統(tǒng)?

網(wǎng)格是具有列、內(nèi)間距和外邊距的結(jié)構(gòu)系統(tǒng),其目的是幫助設(shè)計(jì)師組織界面的內(nèi)容。

內(nèi)間距的距離越窄,越會(huì)向用戶傳達(dá)「這些內(nèi)容屬于同一組」的感覺。

圖片

同理,內(nèi)間距越寬,看起來越像是不同類型的內(nèi)容。

圖片

需要注意的是,內(nèi)間距的距離不要太寬,或者比每一列的寬度還寬,容易導(dǎo)致內(nèi)容之間的留白過大,造成視覺瀏覽上的不連貫。

圖片

此外,外邊距的間距遵循與內(nèi)間距相同的規(guī)則。可以靈活調(diào)整外邊距,以便在內(nèi)容和屏幕之間留出合適的間隔。

圖片

圖片

和內(nèi)間距一樣,屏幕中的外邊距也不能太寬,這樣會(huì)壓縮頁面中內(nèi)容的展示空間,會(huì)讓頁面看起來很局促。

圖片

 

三、使用網(wǎng)格設(shè)計(jì)的四條準(zhǔn)則

網(wǎng)格的使用看起來很直觀,但在UX或UI項(xiàng)目中使用網(wǎng)格系統(tǒng)仍有一些需要注意的規(guī)則。

1、將元素集中在每一列中

上面說到,在設(shè)計(jì)中常用到的是12列網(wǎng)格系統(tǒng)。那么12列網(wǎng)格為什么被廣泛使用呢?主要原因在于12列網(wǎng)格更方便擴(kuò)展不同的布局形式。

圖片

▲ 12列網(wǎng)格可以一行排列兩個(gè)內(nèi)容,各占6列網(wǎng)格;一行排列三個(gè)內(nèi)容,各站四個(gè)網(wǎng)格;一行排列四個(gè)內(nèi)容,各占3列網(wǎng)格;一行排列六個(gè)內(nèi)容,各占2列網(wǎng)格。

基本上,常用到的頁面布局形式在12列網(wǎng)格中都可以實(shí)現(xiàn)。

圖片

▲ 在每個(gè)內(nèi)容之間留出足夠的內(nèi)邊距。這里需要注意的是,內(nèi)容的兩側(cè)要與每一列的邊緣重合,而不是與內(nèi)邊距重合。

圖片

▲ 當(dāng)內(nèi)容居中顯示時(shí),要始終在邊緣留出一點(diǎn)空間,防止頁面被內(nèi)容填充的過于擁擠。

2、不要將列數(shù)作為內(nèi)容填充

在網(wǎng)格系統(tǒng)下,設(shè)計(jì)應(yīng)該填充整個(gè)內(nèi)容的寬度,這樣會(huì)讓界面看起來更規(guī)范。

圖片

不要讓左右兩列沒有填充內(nèi)容,讓列數(shù)作為填充,這樣會(huì)導(dǎo)致頁面的外邊距不統(tǒng)一,增加后期的開發(fā)成本。

圖片

3、可以嘗試脫離網(wǎng)格

在設(shè)計(jì)中,使用從網(wǎng)格中溢出的圖像或元素也是可以的。

圖片

例如我們想填充一個(gè)全尺寸的背景色或者圖像,只需將圖像拉到網(wǎng)格之外就可以。在網(wǎng)格和邊距的示意下,開發(fā)人員也能夠快速理解界面的尺寸信息。

4、注意內(nèi)容之間的間距

在網(wǎng)格上放置不同的元素時(shí),確保元素之間的左右間距、上下間距都是一致的,這樣會(huì)讓整個(gè)界面看起來更規(guī)范。

圖片

 

最后

除了能夠改善設(shè)計(jì)、減輕用戶認(rèn)知負(fù)擔(dān)外,網(wǎng)格系統(tǒng)還能提升設(shè)計(jì)效率。有了網(wǎng)格我們可以快速衡量元素的間距、邊距的精度,簡(jiǎn)化設(shè)計(jì)過程。

另外,在規(guī)范的網(wǎng)格系統(tǒng)中,界面布局或內(nèi)容上的修改也會(huì)變得更容易。

慢慢來比較快,希望對(duì)你有幫助!


作者:Clippp

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》如何讓你的設(shè)計(jì)看起來更有說服力?試試網(wǎng)格系統(tǒng)!

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



簡(jiǎn)直不敢相信,加上這個(gè)元素,瞬間高級(jí)感爆棚!

seo達(dá)人



圖片

這個(gè)問題還是比較普遍,曾經(jīng)遇到很多同學(xué)也是這樣的,所以今天拿出來講講。

一些特殊的欄目和模塊我們最好去花心思設(shè)計(jì)下,這樣可以大大提高UI界面的設(shè)計(jì)感。

 

一、上下分割

在封面設(shè)計(jì)中,可以使用簡(jiǎn)單的上下分割,輕松做出有層次的封面。普遍同學(xué)存在的問題,都是直接找一張圖貼進(jìn)去,如下這樣:

圖片

這種方式設(shè)計(jì),完全體現(xiàn)不出你的設(shè)計(jì),而只是找了一張別人的圖,況且這樣貼進(jìn)去缺少一些特色,不管怎樣,一些關(guān)鍵重點(diǎn)功能還是需要設(shè)計(jì)一下的。

比如,我們可以通過畫面分割的形式,對(duì)一些特殊的重點(diǎn)推薦歌單做個(gè)區(qū)別。

圖片

上面,使用了上下分割的形式,人物和背景上下都有交接,在加上文字版式,整個(gè)封面舊有了視覺張力。

當(dāng)然,還有其他的分割形式,但大思路是一致。

圖片

 

二、大字疊加

同樣的在做一些特殊欄目設(shè)計(jì)時(shí),除了使用分割形式,還有大字疊加,一樣可以做出視覺張力的封面。

圖片

在這里,我們可以將歌手摳出來,然后背景取色和人物同色系,再加上文字版式,效果就來了。

這種風(fēng)格其實(shí)很好學(xué)習(xí),下面簡(jiǎn)單來看看其他案例。

圖片

上圖設(shè)計(jì)思路,采用文字穿插與文字前后疊加的版式設(shè)計(jì)。

圖片

圖片

蘋果音樂的首頁,一些重點(diǎn)歌單推薦,同樣使用了特殊設(shè)計(jì)。

 

三、藝術(shù)字

在封面中進(jìn)行藝術(shù)字設(shè)計(jì),難度略大, 但是效果做出來一樣很精彩,比如下面這種。

圖片

POP三個(gè)字放大設(shè)計(jì),加一些藝術(shù)化效果,整個(gè)設(shè)計(jì)氛圍感就來了。

圖片

圖片

除了上面這張對(duì)英文字體進(jìn)行藝術(shù)化設(shè)計(jì),還有稍微復(fù)雜一些的,比如下面這種。

圖片

 

四、全新設(shè)計(jì)

全新設(shè)計(jì)一張封面,更加體現(xiàn)這個(gè)欄目的特色和亮點(diǎn),也可以讓整個(gè)畫面視覺張力更強(qiáng),當(dāng)然對(duì)設(shè)計(jì)師能力要求也就越高,比如下面這種。

圖片

全新設(shè)計(jì)的好處,可以大大的吸引用戶的眼球。如果是一些新的欄目,新的模塊出現(xiàn),是完全可以花費(fèi)時(shí)間來設(shè)計(jì)。這種設(shè)計(jì)放在你的設(shè)計(jì)稿中,是完全可以拉開你和同事之間的差距。

圖片

圖片

圖片

好了,到這里差不多完事,今天的關(guān)于音樂界面的設(shè)計(jì),提高UI設(shè)計(jì)感,你學(xué)會(huì)了嗎。

好了,今天文章就到這里。

原創(chuàng)不易,如果對(duì)你有幫助,記得給我點(diǎn)個(gè)贊,支持下我們。


作者:劉濤導(dǎo)師

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》簡(jiǎn)直不敢相信,加上這個(gè)元素,瞬間高級(jí)感爆棚!

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



ISUX「七月」行業(yè)設(shè)計(jì)趨勢(shì)速遞

seo達(dá)人


圖片

 

本期摘要:

(1)Facebook 開始在美測(cè)試NFT功能(2)Facebook Groups 引入頻道功能 (3)Niantic 正式推出社交應(yīng)用 Campfire(4)twitter 內(nèi)測(cè)多人共同編輯一條tweet的能力(5)Instagram Reels 短視頻功能更新(6)QQ音樂打造音樂版社交元宇宙(7)Meta Horizon Home 讓 VR 更具社交性(8)抖音上線桌面端(9)“中文梗博物館”出現(xiàn)在 VR 世界(10)#Me:現(xiàn)實(shí)社交帶進(jìn)異世界的虛擬游戲(11)上大元宇宙:現(xiàn)實(shí)校園搬上虛擬世界(12)Hay:匹配后直接視頻聊天的社交應(yīng)用(13)陌陌旗下 AR 跳舞 APP —— BonBon Jump(14)字節(jié)元宇宙 APP「派對(duì)島」全面公測(cè)(15)Turn Up:遇見音樂同好(16)vivo 無障礙功能,讓聲音也可以被「看見」

 

一、Facebook開始在美測(cè)試NFT功能 

Meta 產(chǎn)品經(jīng)理 Navdeep Singh 近日在 Twitter 分享 NFT 功能的截圖,他表示公司開始允許部分美國(guó)創(chuàng)作者在 Facebook 上發(fā)布數(shù)字收藏品。從圖中可見,進(jìn)入個(gè)人頁面后,會(huì)在頭像下方的看到〝數(shù)字藏品〞的頁簽,用戶可以在這個(gè)專屬頁簽中展示 NFT,這些藝術(shù)品也會(huì)有一個(gè)〝數(shù)字藏品〞的標(biāo)簽 。

用戶能在發(fā)文時(shí)附上想要分享的 NFT,如同一般貼文,可讓好友點(diǎn)贊、留言和分享,點(diǎn)擊后還會(huì)顯示有關(guān)該 NFT 的詳細(xì)資訊。 

圖片

圖片

 

二、Facebook Groups 引入頻道功能

Facebook 宣布將在 Facebook 群組引入全新的頻道功能,讓成員進(jìn)行更集中的討論。

管理員可以創(chuàng)建三種類型的頻道:聊天、Feed 和語音。聊天頻道能讓用戶在 Facebook 群組和 Messenger 上更加實(shí)時(shí)地留言、討論特定話題;Feed 頻道讓管理員圍繞不同形式的主題組織社區(qū),成員們可以基于具體的興趣或話題進(jìn)行討論;語音頻道則是允許管理員和成員隨時(shí)加入和退出語音對(duì)話,并且支持開啟攝像頭。

圖片

Facebook 宣稱正在測(cè)試新的側(cè)邊欄,有助于用戶快速找到喜愛的群組。側(cè)邊欄將列出個(gè)人所屬的群組、最新活動(dòng)和新的帖子,支持用戶將喜愛的群組固定在側(cè)邊欄頂部。

圖片

 

三、Niantic 正式推出社交應(yīng)用 Campfire 

Niantic 宣布在特定地區(qū)推出社交應(yīng)用 Campfire ,并計(jì)劃在今年夏天將 Campfire整合進(jìn)公司旗下游戲。Campfire 是一個(gè)〝真實(shí)世界〞的元宇宙平臺(tái),幫助用戶發(fā)現(xiàn)新的游戲與活動(dòng)。 

打開應(yīng)用時(shí),用戶會(huì)看到所在地區(qū)的動(dòng)態(tài)地圖,包含好友和其他玩家以及附近正在進(jìn)行的游戲與活動(dòng),從右上角的圖標(biāo)能進(jìn)入社區(qū)或游戲特定地圖。

圖片

除了游戲之外,Campfire 還提供豐富的社交功能,讓用戶與朋友保持聯(lián)系,并從動(dòng)態(tài)地圖上發(fā)現(xiàn)附近的玩家、社區(qū)活動(dòng),從而結(jié)交新朋友。用戶可以組織各種活動(dòng),與朋友分享自己的位置,追蹤即將到來的聚會(huì)動(dòng)態(tài),開始小組聊天等。

圖片

在《Pokémon GO》中,小精靈訓(xùn)練家可以通過消息與朋友共享位置,從而輕松快速高效地組建團(tuán)隊(duì)。若是單人游戲,可以點(diǎn)擊地圖上的一個(gè)特定位置,添加信號(hào)彈(Flare),鼓勵(lì)大家一起參與游戲。

Campfire 的特點(diǎn)是基于真實(shí)世界 AR 的社交網(wǎng)絡(luò),目的是增強(qiáng)整體游戲用戶的粘性,同時(shí)有利于《Pokémon GO》、《Ingress》等Niantic旗下遊戲玩家之間的溝通。

 

四、Twitter 內(nèi)測(cè)多人共同編輯一條 Twitter 的能力 

Twitter 已開始測(cè)試一項(xiàng)新的 “CoTweets” 功能,該功能允許用戶共同撰寫推文。CoTweets 正處于測(cè)試階段 ,美國(guó)、加拿大和韓國(guó)地區(qū)的部分用戶可體驗(yàn)到該功能。

圖片

用戶可以向關(guān)注的好友發(fā)送 CoTweet 邀請(qǐng),待對(duì)方接受后將創(chuàng)建一個(gè) CoTweet,顯示雙方都是共同作者。此外,同一條 CoTweet最多只能兩人撰寫,因此每個(gè) CoTweet 只能邀請(qǐng)一位共同作者。

圖片

 

五、Instagram Reels短視頻功能更新 

Reels 是由 Instagram 推出的短視頻社交平臺(tái),對(duì)標(biāo) TikTok,Instagram 之前也支持短視頻能力,Reels 重點(diǎn)為豎屏短視頻,努力提供更多全屏沉浸式內(nèi)容。Instagram 宣布15分鐘以內(nèi)的新視頻帖子將以 Reels 形式分享,相比之前的90秒時(shí)長(zhǎng)大大放寬。

圖片

在拍攝能力方面推出雙向攝像頭的內(nèi)容生成方式,讓用戶拍攝時(shí)能分享當(dāng)下的反應(yīng)。并推出模板功能,用戶通過上傳視頻和照片來填充模板生成內(nèi)容。

圖片

另一個(gè)同樣雙畫面的功能由 Facebook Gaming 推出,Clips to Reels 功能提供游戲畫面和創(chuàng)作者攝像頭的兩個(gè)畫面,將游戲片段和錄播快速轉(zhuǎn)換為 Reels,支持添加背景音樂、自帶濾鏡和特效。

圖片

 

六、QQ音樂打造音樂版社交元宇宙 

Music Zone 是QQ音樂為用戶打造的全新虛擬音樂社區(qū),將其作為元宇宙領(lǐng)域的首次嘗試,希望為用戶帶來沉浸式互動(dòng)體驗(yàn)。

用戶登錄QQ音樂 APP 后,可在 Music Zone 中設(shè)定專屬人物形象,并能獲取虛擬形象,其形象靈感致敬經(jīng)典的火柴人 Mfer。

圖片

Music Zone 類似于超級(jí)QQ秀的QQ小窩,用戶可以獲得一個(gè)獨(dú)立的家,用戶可以隨意裝扮自己的家,并在墻壁上掛有虛擬播放界面和歌單墻,用戶點(diǎn)擊虛擬播放器進(jìn)行歌曲的播放,訪問的人也能進(jìn)行點(diǎn)播。

圖片

 

圖片

Music Zone 提供了社交功能,用戶能在社區(qū)地圖上任意選擇一個(gè)家進(jìn)行訪問,并對(duì)訪問對(duì)象的家進(jìn)行點(diǎn)評(píng),關(guān)注對(duì)象以及加好友。QQ 音樂的用戶享受到虛擬社交體驗(yàn)的同時(shí),還能進(jìn)一步增強(qiáng) QQ 音樂內(nèi)的社交關(guān)系鏈,打造一個(gè)興趣社區(qū)。

圖片

 

七、Meta Horizon Home 讓 VR 更具社交性 

Meta 公布 Quest 2頭顯將推出 Horizon Home 功能,借助該功能讓用戶和朋友實(shí)現(xiàn)虛擬串門。用戶可以從一些預(yù)設(shè)選項(xiàng)中選擇場(chǎng)景作為自己的家,可以是空間站、日本旅館或俯瞰山間的日落的露臺(tái)等等,甚至可以自己上傳場(chǎng)景。

(點(diǎn)擊圖片前往原文觀看視頻)

圖片

創(chuàng)建完畢后,可以邀請(qǐng)朋友到自己的 Horizon Home 環(huán)境里進(jìn)行和參觀、閑聊,甚至還能直接支持開啟多人游戲(游戲包括 Beat Saber、Demeo 和 Echo VR),滿足線上面對(duì)面社交化更強(qiáng)的游戲體驗(yàn)。

圖片

扎克伯格還和攀巖運(yùn)動(dòng)員 Alex Honnold 一起在 Horizon Home 里觀看了 Alex Honnold 在攀登多洛米蒂山( Dolomiti )懸崖的360度紀(jì)錄片《 The Soloist VR 》,這一虛擬現(xiàn)實(shí)紀(jì)錄片中可 Meta Quest 頭顯的 Oculus TV 上觀看。

(點(diǎn)擊圖片前往原文觀看視頻)

圖片

在 Meta 的設(shè)想里,VR 是一個(gè)社交平臺(tái),Horizon Home 就是一個(gè)社交空間,玩家可以在其中與朋友一起閑逛、一起觀看視頻…就連 Dropbox、Facebook 和 Instagram 等軟件,之后也將在 VR 中作為 Horizon Home 中的 2D 面板應(yīng)用程序運(yùn)行,玩家不需要摘下頭顯就能進(jìn)行訪問。

圖片

 

八、抖音上線桌面端 

抖音推出了 PC 電腦版,讓用戶在電腦大屏上就可以刷短視頻,其實(shí)之前也可以通過抖音的網(wǎng)頁版在電腦上刷短視頻,但網(wǎng)頁版的功能相對(duì)過于簡(jiǎn)單。

(點(diǎn)擊圖片前往原文觀看視頻)

PC 版客戶端和手機(jī)版抖音在風(fēng)格上保持基本一致,默認(rèn)采用深色效果,不過在右上角設(shè)置區(qū)域也能在深色和淺色兩種模式間互相切換。左側(cè)邊框區(qū)域是視頻分類區(qū),這里分布著“直播”、“熱點(diǎn)”、“娛樂”、“游戲”等不同視頻的進(jìn)入通道。

(點(diǎn)擊圖片前往原文觀看視頻)

PC 版抖音客戶端相比手機(jī)版而言,基于桌面場(chǎng)景在視頻瀏覽上做了差異化的體驗(yàn)。一是能夠選擇“自動(dòng)連播”,無需手動(dòng)翻頁刷新自動(dòng)播放下一個(gè)視頻,真正地解放了雙手;二是視頻播放能用鼠標(biāo)、鍵盤快捷鍵進(jìn)行操作,體驗(yàn)更方便、自然。

圖片

 

九、“中文梗博物館”出現(xiàn)在 VR 世界 

最受歡迎的 VR 聊天室應(yīng)用 VRChat 上線了一個(gè)高質(zhì)量中文場(chǎng)景“中文梗博物館”,由B站視頻作者“四跡”帶領(lǐng)網(wǎng)友創(chuàng)造的,收納了2010年前后互聯(lián)網(wǎng)在國(guó)內(nèi)普及至今,于視頻網(wǎng)站和社交網(wǎng)絡(luò)流行的大量梗,并迅速成為亞文化圈層話題。

與現(xiàn)實(shí)中的大多數(shù)博物館不同,進(jìn)入中文梗博物館并不需要門票,只需要在 VRChat 中搜索名稱,跳轉(zhuǎn)并能直接進(jìn)入。雖然是在虛擬世界中構(gòu)建,這個(gè)博物館卻有著真實(shí)博物館一般的入口、展館分布、陳設(shè)乃至藏品展示,并不因非商業(yè)團(tuán)隊(duì)制作而顯得質(zhì)量低劣。

(點(diǎn)擊圖片前往原文觀看視頻)

展品來源算得上是包羅萬象。從簡(jiǎn)單的聊天對(duì)話引出的話題,到圖片和短視頻等當(dāng)今更流行的載體,再到影視劇、動(dòng)畫漫畫的名場(chǎng)面,以及為中國(guó)互聯(lián)網(wǎng)行業(yè)蓬勃發(fā)展提供驅(qū)動(dòng)力的電子游戲等。

由于中文梗博物館是搭載在VR Chat平臺(tái)中的線上虛擬展會(huì),用戶可以根據(jù)VR平臺(tái)提供的各類模板自定義自己的形象,觀展者甚至可以配合展廳中的梗,成為梗中角色或物件,和其他觀展者互動(dòng),提供社交破冰的切口。在溝通方面,用戶之間可以建立獨(dú)立聊天室,讓聊天內(nèi)容不公放,確保私密性,也不會(huì)打擾到其他在觀展的玩家。

圖片

 

十、#Me:現(xiàn)實(shí)社交帶進(jìn)異世界的虛擬游戲 

#Me 由韓國(guó)游戲公司 Clover Games 研發(fā),于7月7日上線,是一款二次元風(fēng)格的3D元宇宙產(chǎn)品,在上線前全球預(yù)約人數(shù)已經(jīng)超過100萬。

圖片

背景為世界突然間出現(xiàn)可以穿越到異世界的入口,玩家在編輯好自己的 Avatar 后進(jìn)入世界,最大特色的設(shè)定是手機(jī)的網(wǎng)絡(luò)社交能力依然存在。

(點(diǎn)擊圖片前往原文觀看視頻)

游戲主界面整體氣氛像直播應(yīng)用,有日夜系統(tǒng)。能與NPC視頻通話、互相關(guān)注,可以像現(xiàn)實(shí)生活中那樣拍照記錄,分享到社交媒體(風(fēng)格像 Instagram)上。

圖片

玩家在世界中冒險(xiǎn),會(huì)有一個(gè)陪伴的小伙伴 “Campy” 作為游戲向?qū)?,并為玩家旅途的拍攝記錄高光時(shí)刻,讓玩家能合理地產(chǎn)生第三視角的內(nèi)容。收獲粉絲認(rèn)可,成為玩家重要的成就體系。

圖片

玩家通過完成任務(wù)可以解鎖不同的地點(diǎn),也可以隨意在世界里逛逛,和路過的玩家輕互動(dòng),目前看還是偏重游戲輕社交。

(點(diǎn)擊圖片前往原文觀看視頻)

 

十一、上大元宇宙:現(xiàn)實(shí)校園搬上虛擬世界 

上大元宇宙由上海大學(xué)上海美術(shù)學(xué)院蔣飛教授和學(xué)生們共同創(chuàng)作,名為SHU Metaverse,以上海大學(xué)寶山校區(qū)為原型的一個(gè)虛擬校園。

圖片

在疫情背景下,校園生活也受封控影響,一個(gè)還原高校的虛擬世界,讓師生們能在里面奔跑、互動(dòng)、上課、聽講座、舉行畢業(yè)典禮等,也能做一些平常在校園中不可能做到的事情,如空中飛翔、養(yǎng)寵物、尋寶等。

圖片

上大元宇宙給疫情期間不能到校生活的師生們一個(gè)緩解壓力的平臺(tái),在虛擬校園的云畢業(yè)典禮,帶給畢業(yè)生一份特殊的禮物。

圖片

 

十二、Hay:匹配后直接視頻聊天的社交應(yīng)用 

本周登上 App Store 中國(guó)區(qū)第一位的 Hay,是一款主打?qū)崟r(shí)視頻的社交app,可以與全球范圍的人聊天。

圖片

圖片

Hay 的 UI 采用像素風(fēng)格,整個(gè)應(yīng)用很輕巧,分聊天、匹配和個(gè)人三個(gè) tab。自動(dòng)匹配用戶不需要收費(fèi),系統(tǒng)會(huì)根據(jù)用戶的性別、年齡和興趣標(biāo)簽去匹配,雙方同意后開啟視頻通話,但使用篩選條件匹配需要支付金幣。

圖片

為解決不同文化的語言障礙,視頻聊天時(shí)也提供文字聊天,對(duì)文字進(jìn)行自動(dòng)翻譯,保證雙方能持續(xù)交流。為了鼓勵(lì)用戶多使用 Hay,應(yīng)用有每日簽到、飛行地圖、勛章三種激勵(lì)模式。

圖片

 

十三、陌陌旗下AR跳舞APP:BonBon Jump

出門健身難,擼鐵枯燥無趣,網(wǎng)紅燃脂舞視頻跟不上……近日,陌陌想通過 AR 新產(chǎn)品「BonBon Jump」來解決這個(gè)問題。

圖片

這是一款使用了 AR 技術(shù)映射自己喜歡的3D形象,并跟隨跳舞健身 App。運(yùn)動(dòng)盒子,可以選擇不同舞種與音樂,選擇自己喜歡的音樂即可開始跳舞。

圖片

只需打開「BonBon Jump」投屏到電視,手機(jī)放在能夠掃描全身的位置即可開始。接下來你就可以穿著自己喜歡的虛擬3D形象,跟隨 AR 游戲指引進(jìn)行舞蹈。通過「BonBon Jump」提供的 AI 識(shí)別技術(shù),可以精準(zhǔn)識(shí)別動(dòng)作數(shù)據(jù),實(shí)時(shí)打分,擁有更科學(xué)的運(yùn)動(dòng)保護(hù)和指導(dǎo)。

圖片

圖片

另外真人動(dòng)作演示,AI 動(dòng)作識(shí)別結(jié)合 AR 玩法,可以讓燃脂舞跟練像玩游戲一樣簡(jiǎn)單。運(yùn)動(dòng)計(jì)劃,可以根據(jù)身高體重,免費(fèi)制定燃脂計(jì)劃,并進(jìn)行記錄,讓運(yùn)動(dòng)更科學(xué)量化。個(gè)人中心,展示運(yùn)動(dòng)戰(zhàn)績(jī)以及高光時(shí)刻,讓運(yùn)動(dòng)變得有儀式感。

 

十四、字節(jié)元宇宙 APP「派對(duì)島」全面公測(cè) 

派對(duì)島 APP,早在2022/01/25就上線應(yīng)用市場(chǎng)。目前,派對(duì)島已開始開放對(duì)外邀請(qǐng),開始放大測(cè)試范圍了。

圖片

圖片

派對(duì)島,是一個(gè)實(shí)時(shí)線上活動(dòng)社區(qū)。派對(duì)島的 slogan 是:沒有人是一座孤島。在這個(gè)虛擬人社區(qū)里,創(chuàng)建你的個(gè)人形象后,可以參與和創(chuàng)建線上活動(dòng)。讓你與其他同好輕松社交,找到趣味相投的人。同時(shí),你也可以自己創(chuàng)建活動(dòng),邀請(qǐng)別人來參與。

圖片

這個(gè)小島上,有街心花園,有溫馨小屋。你可和小島上新交的朋友,一起 party。也能體驗(yàn)新奇有趣的沉浸式聊天。與朋友和同好相遇在島上,和朋友相遇,聊天。

圖片

 

圖片

 

十五、Turn Up:遇見音樂同好 

上次介紹了網(wǎng)易云音樂旗下的音樂社交產(chǎn)品 MUS。其實(shí)早在2018年3月 Turn Up 就已經(jīng)上線。截至目前,進(jìn)入了29個(gè)國(guó)家和地區(qū)的 App Store 生活類暢銷榜  Top100。Turn Up 在音樂和社交的聯(lián)通上有很多可借鑒之處。

圖片

① 首先,用戶需要對(duì)音樂資料卡進(jìn)行完善。選出至少3位最喜歡的歌手、主頁播放歌曲為必填內(nèi)容;然后通過多場(chǎng)景的音樂選擇,提示用戶填寫資料卡片,資料越詳細(xì)匹配到心儀用戶的幾率越高。比如:最無法忍受的歌手、適合約會(huì)的歌曲、將在婚禮播放的歌曲、將在葬禮上播放的歌曲等。

② 系統(tǒng)會(huì)根據(jù)用戶填寫的歌手和單曲,來判定用戶喜歡的音樂類別,并將具有相同音樂偏好的用戶放在同一匹配池。

  • Swipe,用戶可以如使用 Tinder 一般,對(duì)自己感興趣的用戶進(jìn)行右滑、對(duì)不感興趣的用戶進(jìn)行左滑。
  • 音樂盲盒,直接向自己感興趣的用戶發(fā)送消息或者嘗試猜出對(duì)方的音樂盲盒。用戶需要在30秒內(nèi)以“4選1的選擇題模式”根據(jù)歌曲節(jié)選片段猜對(duì)歌曲名稱,完成猜歌任務(wù)后系統(tǒng)會(huì)自動(dòng)顯示猜歌結(jié)果,用戶可以根據(jù)自己的答題情況初步判定彼此的音樂品味是否相投。

圖片

  • 線下活動(dòng),Turn Up 也會(huì)為每一個(gè)線下活動(dòng)設(shè)立一個(gè)匹配池,用戶可以在匹配池左右滑動(dòng)尋找感興趣的用戶。這就相當(dāng)于將“線上”和“線下”進(jìn)行了串聯(lián),線上好友在不久后就可以在線下碰面。

 

十六、vivo 打造的無障礙功能,讓聲音也可以被「看見」 

我國(guó)是全球聽障人士最多的國(guó)家,聽障群體總?cè)藬?shù)有將近 3000 萬人,聽障群體日常需要面對(duì)很多非?;镜膯栴}。

針對(duì)聽障人士最基本的生活場(chǎng)景,vivo 推出了「vivo 聽說」和「無障礙通話」功能。這些功能讓原本生活中只能靠「聽」的話語變成「看」得見,為所有人提供了多一種獲取信息的方式。

兩個(gè)功能使用的主要技術(shù)是語音識(shí)別技術(shù)和語音合成技術(shù),都是我們平時(shí)常常會(huì)用到基礎(chǔ)技術(shù)。

圖片

開啟功能后,每次接電話時(shí)就會(huì)彈出對(duì)話框。電話另一頭的語音會(huì)被翻譯成文字,而這一頭輸入的文字,也會(huì)轉(zhuǎn)錄為語音播給對(duì)方聽。同時(shí),用戶還可以設(shè)置常用語。打車、收快遞和外賣等重復(fù)類場(chǎng)景可以更快捷應(yīng)對(duì)。

「vivo 聽說」則是為線下對(duì)話場(chǎng)景而設(shè)。以前,我們有把語音轉(zhuǎn)換成文字的應(yīng)用,也有把文字變成語音的應(yīng)用,但「vivo 聽說」把兩個(gè)功能結(jié)合起來,因?yàn)檫@樣才是一個(gè)完整「對(duì)話」。

點(diǎn)一下屏幕底部的「耳朵」,開始「聽」,實(shí)時(shí)將語音轉(zhuǎn)錄為文字。點(diǎn)一下旁邊的「鍵盤」,輸入想說的,讓文字「說」出聲。

而且,「vivo 聽說」還能小框化,用戶可以一邊使用其它應(yīng)用一邊「收聽」其他人說的話。

以上就是2022年7月ISUX行業(yè)設(shè)計(jì)趨勢(shì)速遞,喜歡記得收藏轉(zhuǎn)發(fā),以備不時(shí)之需查看。

 

原文地址:騰訊ISUX

作者:ISUX設(shè)計(jì)

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》ISUX「七月」行業(yè)設(shè)計(jì)趨勢(shì)速遞

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司




一次教你16種宋體字的變化!

seo達(dá)人


(點(diǎn)擊圖片前往原文查看視頻)

(點(diǎn)擊圖片前往原文查看視頻)

 

如果不喜歡看視頻也沒關(guān)系,這里還有貼心的圖文版詳細(xì)過程,下面一起來看一下都是哪 16 種。(視頻中只有 15 種,最后一種是我臨時(shí)加上去的。)

圖片

開始我們今天的正題,逐一來講解一下。

 

 

圖片

宋體當(dāng)中的筆畫美感是比較重要的,而如果對(duì)于字體沒有太多了解的話,是比較難刻畫出精致宋體筆畫的,所以我們可以對(duì)筆畫進(jìn)行一定程度的簡(jiǎn)化,當(dāng)然主要是對(duì)于橫豎筆畫的簡(jiǎn)化,全部做成直線的形態(tài)。

圖片

其次則是撇捺點(diǎn)的筆畫,可以簡(jiǎn)化成一個(gè)帶有曲線的三角形,同時(shí)把邊緣處切平處理??雌饋頃?huì)更簡(jiǎn)潔現(xiàn)代。

圖片

這樣我們就得到了一組簡(jiǎn)化過的筆畫,其實(shí)這一步主要的思路就是把筆畫處理的更幾何,自然也就更簡(jiǎn)化了。

圖片

下面就可以用這些筆畫來進(jìn)行拼字了,選擇思源宋作為結(jié)構(gòu)參考。這里我把思源宋拉的瘦高了一點(diǎn),大家也可以根據(jù)自己想要的感覺去自行調(diào)整。

圖片

最后,適當(dāng)調(diào)整布局,兩行錯(cuò)排,添加一些小文字進(jìn)行排版即可。

圖片

這里結(jié)合最終的排版,添加了一點(diǎn)點(diǎn)連筆和筆畫延長(zhǎng)的處理,后面會(huì)單獨(dú)講連筆的形式。

 

 

圖片

斷筆這一方式已經(jīng)老生常談了,在字體設(shè)計(jì)中的使用頻率非常高,常規(guī)的斷筆方式大家應(yīng)該都是會(huì)的,就是對(duì)筆畫與筆畫有接觸的位置進(jìn)行斷開即可,那其實(shí)也可以嘗試斷開的更多一些,把所有接觸的筆畫都進(jìn)行斷開。

圖片

當(dāng)然這個(gè)方法也可以和簡(jiǎn)化做同時(shí)使用,依然選擇思源宋墊底,搭建字形,這里我是拉寬了一些。

圖片

再來對(duì)整體進(jìn)行斷開,還是相同的方法,但氣質(zhì)完全不一樣了。

圖片

最后添加排版,這一組就完成了。

圖片

接著來看第三種方法。

 

 

圖片

這一方法有點(diǎn)類似于斷筆的加強(qiáng)版,只是略微有點(diǎn)不同,那具體做法就是把整條橫筆全部省略掉,只保留筆畫末端的修飾。

圖片

首先依舊是搭建結(jié)構(gòu),這一部分并沒有任何區(qū)別,大家可以自由的設(shè)定筆畫造型,以及筆畫的粗細(xì),來達(dá)到自己想要的感覺。

圖片

下面就很簡(jiǎn)單了,把字體中所有最細(xì)的橫筆給刪掉,保留末端的小三角特征即可。

圖片

最后也可以根據(jù)字義適當(dāng)增加一點(diǎn)意境,我這里加了一些模糊效果。

圖片

這里稍微多說幾句,有些字并不能把所有橫筆全都省略掉,因?yàn)闀?huì)比較嚴(yán)重的影響識(shí)別,比如日字,干字,等一些字里面只有橫豎筆畫的字,我們就不能對(duì)橫筆全部省略。

圖片

這種情況就要適當(dāng)去保留一些橫筆了,根據(jù)識(shí)別情況,進(jìn)行還原橫筆的多少即可,識(shí)別低就多還原一些橫筆,識(shí)別夠高則可以多省略一些的。

圖片

這兩個(gè)字真不是故意的,腦子里就只想到了這兩個(gè)字比較適合…

 

 

圖片

這也是一個(gè)非常好用,非常實(shí)用的方式,連筆,其實(shí)連筆的方法無非就那么幾種,最常用的就是根據(jù)手寫的習(xí)慣和規(guī)律進(jìn)行連筆,再一個(gè)則是順勢(shì)而連,當(dāng)然也有一些逆向連接和非常規(guī)的連筆手段,但那需要一定的積累和經(jīng)驗(yàn)了,今天我們主要談的就是基于手寫習(xí)慣這一方式。

方法略有一些不同,首先我們要先根據(jù)墊底字進(jìn)行畫草圖來嘗試可以做連筆的位置,以及連筆的造型。這里可以進(jìn)行大量的嘗試,選擇整體看起來比較舒服的姿勢(shì)再往下做。

圖片

我們來稍微分析一下草圖,首先第一組是不太合適的,因?yàn)橥踝峙缘淖冃芜^于繁瑣,我們?cè)偬鎿Q進(jìn)宋體筆畫的時(shí)候,很可能會(huì)完全糊掉。

圖片

下面再來看第二組,連筆的走勢(shì)是沒什么問題的,但略微平淡了些,且少字的連筆形態(tài)不是很好看,所以可以作為備選項(xiàng)。

圖片

再來看一下最后一組,這一組是可行的,連筆的走勢(shì)比較飄逸,且王字旁的連筆并不是那么常規(guī),所以可以用這一組來作為參考。

圖片

這里的筆畫設(shè)定的比較細(xì),而且較為鋒利,因?yàn)橄氲矫倒鍘Т?,少年也帶要帶點(diǎn)刺,所以做了一個(gè)這樣的設(shè)定,大家做不同的主題可以設(shè)定不同的筆畫粗細(xì)和細(xì)節(jié)處理。

圖片

接下來直接用畫好的草圖墊底拼字就可以了,這一組我也是把字拉的瘦高了一些,也是因?yàn)椤干倌辍惯@個(gè)詞,如果是「玫瑰大叔」的話,可能我就會(huì)做的短粗胖一些了。

圖片

圖片

 

 

圖片

這一方法實(shí)際上就是結(jié)合了簡(jiǎn)化和連筆的方式,但氣質(zhì)還是有明顯的區(qū)別的。

圖片

這里在筆畫上我簡(jiǎn)化的不算特別多,橫豎筆畫設(shè)定的粗細(xì)較為類似,撇捺點(diǎn)這一類筆畫在起筆和收筆處還是保留了一些角度,并沒有完全切平。

圖片

首先還是搭建結(jié)構(gòu),不管做什么變化,都要在結(jié)構(gòu)穩(wěn)定的基礎(chǔ)上去做,不然字體會(huì)越變?cè)絹y的,一直使用思源宋呢,是因?yàn)榭梢悦赓M(fèi)商用,即使改動(dòng)不大也不用擔(dān)心版權(quán)問題,如果大家有基礎(chǔ),可以選擇其他墊底字。

圖片

這里的連筆形式絕大多數(shù)都是基于手寫的規(guī)律而連接的,就不再重新畫草圖分析了。

圖片

最后再簡(jiǎn)單排個(gè)版,加個(gè)英文和一點(diǎn)小裝飾即可。

圖片

 

 

圖片

這一方法是比較簡(jiǎn)單且很容易出效果的,常規(guī)的宋體結(jié)構(gòu)很容易就看膩了,這個(gè)時(shí)候我們可以考慮用楷體的結(jié)構(gòu),但依然使用宋體的筆畫,最終效果就是下面的樣子了。

圖片

首先還是要稍微設(shè)定一下筆畫的造型,這種形式不用設(shè)定太復(fù)雜的筆畫造型,常規(guī)一點(diǎn)就可以了,因?yàn)榻Y(jié)構(gòu)并不是常規(guī)的宋體,所以設(shè)計(jì)感也并不體現(xiàn)在筆畫上。

圖片

下面選擇一個(gè)稍微正一點(diǎn)的楷體來墊底參考結(jié)構(gòu),這里我選的是華文楷體,然后拉高了一點(diǎn)。

圖片

這里也可以稍作一點(diǎn)變動(dòng),比如口字部分下方的橫筆替換成提的形式是比較常用的方法,愿字上邊的一撇延伸進(jìn)下邊,從而省略掉橫筆的一部分,也有結(jié)合前面的一些知識(shí)點(diǎn),大家可以靈活去處理。

圖片

最后簡(jiǎn)單排一下就好了。

圖片

 

 

圖片

共性這一概念之前有單獨(dú)開過一篇文章來寫,所以這里就不贅述太多了,簡(jiǎn)單來理解,這里用到的共性就是筆畫上的統(tǒng)一,我們可以從一組字當(dāng)中尋找相同位置,且相似或相同造型的筆畫,進(jìn)行夸張?zhí)幚?,這樣就得到了一組有特征,但整體又很統(tǒng)一的字形了。所以我們還是得先畫草圖來尋找共性筆畫。

圖片

嘗試過后,發(fā)現(xiàn)這一組字當(dāng)中,適合做共性筆畫的要么是撇的筆畫,要么是豎筆延長(zhǎng)成豎撇的形式,像第一組,撇筆畫的位置在每個(gè)字當(dāng)中并不是很統(tǒng)一,所以不是很好的選擇,而第二組則要好得多,維度壁字下邊是強(qiáng)行做的這種處理,有些不和諧,但整體來看是沒問題的,所以這里選擇第二種,延長(zhǎng)豎筆。

圖片

下面還是老樣子,墊底,搭建結(jié)構(gòu),就完了,說實(shí)話寫到這我有點(diǎn)膩了,但還是要繼續(xù)寫下去,既然說了是 16 種,那就得整完…

圖片

正常搭建好結(jié)構(gòu)后,就可以按照草圖階段的想法來進(jìn)行延長(zhǎng)筆畫了。

圖片

然后,排版,就好了。

圖片

 

 

圖片

這個(gè)算是偏技法類型的方式了,毫無難度,一看就會(huì),學(xué)了肯定不會(huì)廢。常規(guī)的描邊形式我們都會(huì)做,一鍵轉(zhuǎn)換就好了。

圖片

在這個(gè)基礎(chǔ)上,把筆畫的邊緣剪斷,然后做一點(diǎn)延長(zhǎng)或是交叉的處理,這樣就能讓字體具備一定的形式和設(shè)計(jì)感了。

圖片

然后還是排版,字體其實(shí)不排版的話,大多數(shù)看起來都會(huì)比較單薄,而且字體單獨(dú)出現(xiàn)的情況也比較少,所以盡量還是要排一下的。

圖片

沒什么難度,幾下就完事了,很快,希望你們每次都這么快。

 

 

圖片

這個(gè)方法其實(shí)不算是設(shè)計(jì)字體的方法,更多算是字體的排列布局的方式,主要就是要對(duì)一組字做一些大小變化,從而讓整體看起來比較有節(jié)奏感。但這里要注意一個(gè)問題,字雖然有大小變化了,但筆畫粗細(xì)是不變的。

首先我們要對(duì)所做的字進(jìn)行大致的分析,哪個(gè)字應(yīng)該大,哪個(gè)字應(yīng)該小。一般來說,筆畫多的字我們可以做的大一點(diǎn),筆畫少的字就做得小一點(diǎn)。

圖片

且上中下或上下結(jié)構(gòu)的字則可以做的瘦高一些,左中右以及左右結(jié)構(gòu)的字則做的寬一些。這是基于漢字的基本結(jié)構(gòu)而有的規(guī)律,當(dāng)然你也可以自己去設(shè)定規(guī)則。

圖片

那其實(shí)還有一個(gè)點(diǎn)需要注意,就是對(duì)齊的位置,要么是底對(duì)齊,要么頂對(duì)齊,要么居中都在一條水平線上,具體要看整體排出來的美感來選擇。

圖片

其實(shí)三種都是可以的,因?yàn)檎w的節(jié)奏是沒問題的,“小大大小小”。這里我選擇最后一種居中對(duì)齊的形式,開始搭建字形。

圖片

可以看到,這里我也做了大量的簡(jiǎn)化,甚至橫豎筆畫我都是用鋼筆畫的等粗線條…我承認(rèn)偷懶了。所以這種方法可以與前面很多知識(shí)點(diǎn)相結(jié)合,能做出很多有意思的宋體字,最后排版也比較簡(jiǎn)單。

圖片

 

 

圖片

這個(gè)方法有點(diǎn)類似給筆畫加裝飾,但不需要那么夸張,我們只需要在正常字體的基礎(chǔ)上,對(duì)筆畫稍稍加一點(diǎn)改變就可以有不同的效果和氣質(zhì)。

圖片

搭建字形的步驟我就不磨嘰了,還是一樣的方法,正常做完就這樣,雖然這里我換了一種形式的筆畫,但還是比較常規(guī),沒什么意思。

圖片

在這一基礎(chǔ)上,稍稍對(duì)筆畫邊緣加入一點(diǎn)類似毛筆字拖出來的墨跡形式,整體就變得好玩多了。

圖片

這種小細(xì)節(jié)不一定要加在所有筆畫上面,大家可以選擇性的添加一些即可,全都加了反而無趣了,最后添加上排版即可。

圖片

 

 

圖片

民國(guó)時(shí)期的美術(shù)字可以說是已經(jīng)達(dá)到了巔峰,現(xiàn)在大家做的很多變化以及形式,有很多都是借鑒于民國(guó)時(shí)期,這里先稍微看幾個(gè)例子。

圖片

可以看到,變化形式非常豐富,S 形狀的筆畫,口字部分的變化,星星元素,幾何元素,各種連筆造型等。那具體做法也比較簡(jiǎn)單,我們只要在正常搭建好結(jié)構(gòu)之后,適當(dāng)替換一些民國(guó)字的特征筆畫進(jìn)來即可。

圖片

最后添加排版,雖然是借鑒了民國(guó)字的筆畫,但這里看起來并不老氣,還是非常好用的。

圖片

需要注意的是這里調(diào)整的更多的其實(shí)還是撇捺點(diǎn)這一類的筆畫,橫豎筆畫還是比較少做變動(dòng)的。

 

 

圖片

虛擬連筆,實(shí)際上就是基于常規(guī)連筆的一個(gè)延展而已,只不過這種形式的適用范圍也比較廣。

那做法其實(shí)就是用稍微細(xì)一點(diǎn)的線條,來勾勒出連筆的走勢(shì)而已,只帶出局部,并非真正的連接上。(ps:這個(gè)方法借鑒了岳昕老師的字。)

圖片

最后再加上偷懶式排版。

圖片

這里再稍微多說幾句,這里面的筆畫我是用鋼筆畫的兩種粗細(xì)的線條,而撇捺的部分采用的是豎筆粗細(xì),然后用寬度工具把收筆的部分給拖窄一點(diǎn)就好了,也是個(gè)偷懶神器。

圖片

 

 

圖片

常規(guī)的字體在視覺上看著都是比較接近正方形的,所以我們偶爾可以對(duì)字體的字面進(jìn)行夸張?zhí)幚?,非常寬扁又或是非常瘦高,都?huì)很直觀的給到視覺感受,這樣看著就比較陌生,那相應(yīng)的也就有了設(shè)計(jì)感。

圖片

這個(gè)就不做案例了,調(diào)整完字面后可以和前面所有的方式做結(jié)合。

 

 

圖片

宋體的筆畫修飾一般都不會(huì)很大,所以當(dāng)我們嘗試把這些修飾放大處理的時(shí)候,那設(shè)計(jì)感自然也就有了,放大特征的對(duì)象主要就是橫筆的末端,和豎筆的起筆或收筆處,當(dāng)然也包括撇的起筆,甚至是連筆的特征都可以去放大處理。也是一個(gè)一秒就學(xué)會(huì)的方式。

圖片

 

 

圖片

這也是一個(gè)專門開過一篇文章來講的方式,西文中用在宋體中的表現(xiàn)更為優(yōu)秀,因?yàn)楣P畫特征較為特別,且西文的數(shù)量極為龐大,具體做法就是通過拆分西文的筆畫,以提取出橫豎撇捺點(diǎn)等中文筆畫。

圖片

乍一看好像英文的最大特征并不能結(jié)合多少,這時(shí)候就要去思考問題了,像英文中的一些細(xì)線的變化非常相似連筆的形式,所以我們可以在中文當(dāng)中去尋找一些可以做連筆的位置,來借鑒英文的特征結(jié)合進(jìn)去??梢越Y(jié)合墊底字大致畫一下草圖進(jìn)行嘗試。

圖片

不需要畫的很細(xì)致,自己能看懂就行,這組字可以做的瘦高一些會(huì)更能凸顯英文特征的氣質(zhì),所以我們可以適當(dāng)調(diào)整一下,就可以直接開始拼字了。

圖片

還是很簡(jiǎn)單的,大家只需要多注意西文筆畫與中文筆畫的契合度,以及把曲線刻畫的流暢一些就問題不大了。

圖片

 

 

圖片

這里主要是對(duì)于古籍碑帖的一些提取與借鑒,相對(duì)來說要難一點(diǎn)點(diǎn),我們先來看一下碑帖。

圖片

首先我們要做的就是提取筆畫,其實(shí)主要就是橫筆的造型要提取出來,其余的筆畫都可以通過橫筆來進(jìn)行延展。那橫筆的起筆部分造型還是很好提取的。

圖片

其次是收筆,但這里的收筆造型并不容易提取出一個(gè)明確的造型,所以這里我直接就做成了最簡(jiǎn)單的三角形。

圖片

其次就是對(duì)于豎筆的延展了,豎筆的部分我們可以直接把橫筆豎起來,這樣能最直接的保證筆畫造型的統(tǒng)一,相應(yīng)的撇的造型也有了,至于捺和點(diǎn)的造型,使用正常宋體的造型就可以了。

圖片

下面直接把碑帖墊在下面使用楷體的結(jié)構(gòu),然后宋體的筆畫,和前面講到的宋楷結(jié)合是一個(gè)意思。

圖片

當(dāng)然也可以把它改成正常宋體的結(jié)構(gòu),筆畫處理成平直的就好了,但結(jié)構(gòu)上會(huì)有一些變動(dòng),大家可以參考字庫(kù)來調(diào)整視覺上的平衡。

圖片

這個(gè)方法的可塑性是比較強(qiáng)的,因?yàn)闀?huì)涉及到比較多的主觀處理,下面我再放幾個(gè)之前做的這種類型的字。

圖片

圖片

圖片

圖片

好了,那這期教程就到這了,我們下期再見,告辭老鐵。


作者:猴子

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》一次教你16種宋體字的變化!

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)www.yvirxh.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



日歷

鏈接

個(gè)人資料

存檔