首頁

內(nèi)容為王的時(shí)代,阿里設(shè)計(jì)師用實(shí)戰(zhàn)案例解讀內(nèi)容化設(shè)計(jì)!

周周

編者按:什么是內(nèi)容化設(shè)計(jì)?設(shè)計(jì)師為什么要關(guān)注內(nèi)容?如何通過設(shè)計(jì)的手段提高內(nèi)容體驗(yàn)?阿里設(shè)計(jì)師用一個(gè)手淘的實(shí)戰(zhàn)案例,幫你掌握內(nèi)容化設(shè)計(jì)的精髓!

前言

如果說好的產(chǎn)品是運(yùn)營出來的,那么內(nèi)容作為用戶體驗(yàn)中的重要部分不容忽視。然而我們在設(shè)計(jì)中經(jīng)常缺乏內(nèi)容體驗(yàn)的意識(shí)。借著第十三屆用戶體驗(yàn)大會(huì)User Friendly 2016的分享,手淘的設(shè)計(jì)師和業(yè)內(nèi)的同學(xué)們一起做workshop,探索如何進(jìn)行行之有效的內(nèi)容策略腦爆,以及思考內(nèi)容產(chǎn)生、組織到流轉(zhuǎn)分發(fā)的設(shè)計(jì)策略和用戶行為數(shù)據(jù)驗(yàn)證。希望能讓大家對(duì)無線端導(dǎo)購的內(nèi)容化設(shè)計(jì)有所啟發(fā)。以下是對(duì)大會(huì)相關(guān)內(nèi)容的整理。

在探討內(nèi)容化設(shè)計(jì)是什么之前,或許有人奇怪:設(shè)計(jì)為什么要關(guān)注內(nèi)容呢?

這7個(gè)秘訣,能幫你做出體驗(yàn)極佳的網(wǎng)頁表單

周周

表單是網(wǎng)頁設(shè)計(jì)中最常見的元素,幾乎每個(gè)網(wǎng)站都會(huì)包含一種甚至幾種不同類型的表單。從簡單的電子郵件搜集和訂閱,到注冊、下單、購買,表單一直伴隨著網(wǎng)頁而存在。所以,設(shè)計(jì)出好看易用的表單是非常有必要的。

也正是因?yàn)楸韱我恢卑殡S這網(wǎng)頁存在,在過去的20多年間,表單的設(shè)計(jì)規(guī)范和標(biāo)準(zhǔn)也一直在逐步發(fā)展。雖然許多網(wǎng)頁中的表單涵蓋了大量的信息也數(shù)量可觀的欄目,但是絕大多數(shù)的優(yōu)秀設(shè)計(jì)和最佳實(shí)踐都是以簡單而著稱。好的表單一目了然,用戶不需要輸入太多信息,條目標(biāo)識(shí)明確,格式清晰,讓用戶盡可能一次就能正確填寫。

授人以漁!用一個(gè)清晰的思路幫你掌握移動(dòng)界面標(biāo)注

周周

授人以魚不如授人以漁,我寫文章的目的并不是讓大家完全按照我的方法來做,而是希望我們都能提高自己的思維方式,因?yàn)楝F(xiàn)在網(wǎng)上的方法與經(jīng)驗(yàn)實(shí)在太多(又不能確定都是正確的),你的大腦永遠(yuǎn)無法承載整個(gè)互聯(lián)網(wǎng)的信息容量,所以與其看那多內(nèi)容,不如從根源上提高自己拆解、分析、總結(jié)的能力,這樣無論以后你遇到什么樣的問題,都能夠迎刃而解。

用好這5個(gè)技巧,幫你快速挑選出最合適的字體

周周

時(shí)下一種流行的設(shè)計(jì)方式是在頁面頂部使用配有簡潔文字的大幅圖片或者視頻,以此吸引用戶進(jìn)入網(wǎng)站。這種設(shè)計(jì)方式最頭疼的就是如何為這些文字選擇合適的字體。

從樣式繁多的字體庫中找到一個(gè)合適的字體,往往會(huì)讓設(shè)計(jì)師感到舉步維艱。但是我們可以使用一些小技巧,就能找到我們需要的字體。讓我們通過下面幾個(gè)精彩的案列來分享這5條建議。

什么是特排字體(Display Type)

小科普!Android和iOS的設(shè)計(jì)到底有什么不同?

資深UI設(shè)計(jì)者

之前有粉絲留言說希望我們能寫一篇關(guān)于iOS和Android平臺(tái)特性對(duì)比的文章,筆者曾經(jīng)為兩個(gè)平臺(tái)分別做過差異化的設(shè)計(jì),所以今天想借此話題為大家介紹一下iOS和Android兩個(gè)系統(tǒng)在設(shè)計(jì)方面的差異之處,讓大家能更好的理解其中的異同并運(yùn)用在自己的設(shè)計(jì)當(dāng)中。

作為智能手機(jī)的最大的兩個(gè)陣營,iOS和Android系統(tǒng)差異一向都是大家津津樂道的話題,其中內(nèi)容通常是圍繞“機(jī)器性能好不好,打開軟件卡不卡”“攝像頭的像素高不高,拍出來的自己美不美”“外觀是不是有bigger”等話題展開的。

但在一個(gè)設(shè)計(jì)師眼里,這兩個(gè)系統(tǒng)的差異性之多可遠(yuǎn)遠(yuǎn)不止表面上看起來的那么簡單粗暴。但在移動(dòng)端趨勢有如春草那樣蔓延開來的今天,大多數(shù)的公司都選擇把iOS的界面直接運(yùn)用于Android系統(tǒng)。我們自然可以理解這樣做是為了節(jié)省成本和更快的迭代,但抹殺了系統(tǒng)特性的運(yùn)用卻犧牲了許多Android用戶的用戶體驗(yàn)。盡管知乎也有類似回答過兩個(gè)系統(tǒng)交互的不同,今天筆者想更著重介紹一下兩者設(shè)計(jì)語言的異同。

總結(jié)了日式網(wǎng)站這4個(gè)優(yōu)點(diǎn)后,我能把中文網(wǎng)站做得高大上了!

周周

本文通過分析日式網(wǎng)站的色彩、圖片、文字和元素運(yùn)用,幫你充分吸收日式網(wǎng)站的精華,讓中文網(wǎng)站的設(shè)計(jì)也變得高大上!

色彩

當(dāng)我們看到小清新的網(wǎng)站的時(shí)候首先一定會(huì)想到日式網(wǎng)站。

Sarara 是一家純凈水的網(wǎng)站,所以它的網(wǎng)站主題色系為藍(lán)色系,主要由高飽藍(lán)色到低飽藍(lán)色的過度,加上明暗對(duì)比的強(qiáng)烈,直接了當(dāng)?shù)耐怀鲂麄鞯漠a(chǎn)品。

用騰訊企鵝電競的案例告訴你完整的品牌設(shè)計(jì)該怎么做

周周

者按:“幫忙做個(gè)LOGO?” 很多外行不清楚一個(gè)品牌設(shè)計(jì)的過程,才會(huì)屢次提出類似的問題。這篇文章將騰訊企鵝電競的LOGO 的設(shè)計(jì)過程都寫了下來,看完漲姿勢,防甲方!

LOGO 最終效果圖

 

人工智能時(shí)代,不想失業(yè)的設(shè)計(jì)師應(yīng)該提前做哪些準(zhǔn)備?

周周

今年元旦,AlphaGo 連續(xù)挑戰(zhàn)包括聶衛(wèi)平、柯潔、樸廷桓在內(nèi)的中韓頂尖圍棋選手,三天內(nèi)取得的戰(zhàn)績?yōu)榱钊苏ι嗟?60 勝 0 負(fù)。在過去一年的互聯(lián)網(wǎng)舞臺(tái)上,人工智能 (Artificial Intelligence)站在了聚光燈的中心。AlphaGo 在新年伊始, 為 2016 年打上了一個(gè)大大的驚嘆號(hào)。

本文轉(zhuǎn)載自「UX Coffee 設(shè)計(jì)咖」微信公眾號(hào),微信內(nèi)搜索「uxcoffee」

過去這一年,和 AI 相關(guān)的新聞鋪天蓋地。身為設(shè)計(jì)師的你可能會(huì)問:人工智能和我的日常工作有關(guān)嗎?我應(yīng)該為此做什么準(zhǔn)備?

  • 適讀人群:擁抱未來的設(shè)計(jì)師
  • 閱讀時(shí)長:約5分鐘

人工智能和設(shè)計(jì)師有關(guān)嗎?

回首過去這一年全球科技公司的大事件,「人工智能」幾乎是一個(gè)繞不開的關(guān)鍵詞。

  • 3月,人機(jī)圍棋世紀(jì)之戰(zhàn)打響:李世乭在 5 番棋中以1:4敗給 AlphaGo,震驚了整個(gè)圍棋界以及……朋友圈…
  • 4月,人工智能成為 Facebook 開發(fā)者大會(huì)上的主角,基于 AI 技術(shù)的聊天機(jī)器人開放平臺(tái),讓很多人第一次感性地認(rèn)識(shí)了這個(gè)聽起來有點(diǎn)深?yuàn)W的技術(shù)概念。
  • 5月,Google 首席執(zhí)行官 Sundar Pichai 在 Google IO 上高調(diào)宣布公司未來戰(zhàn)略將由「移動(dòng)優(yōu)先」轉(zhuǎn)向「人工智能優(yōu)先」,并發(fā)布了智能語音家庭助理 Google Home。
  • 9月,Amazon、Facebook、Google、IBM、Microsoft 五家公司宣布在人工智能領(lǐng)域建立合作,分享其各自在 AI 技術(shù)上的突破,以吸引更多人才進(jìn)入這一領(lǐng)域。
  • 12月,Amazon 宣布他們在剛剛過去的這個(gè)圣誕假期中,賣出了上百萬臺(tái) Amazon Echo (亞馬遜旗下智能語音助理)。
  • 上月,前微軟高級(jí)副總裁陸奇宣布將加盟百度,除了負(fù)責(zé)百度旗下眾多主線產(chǎn)品業(yè)務(wù),還將專攻人工智能研發(fā)。

日歷

鏈接

個(gè)人資料

存檔