設(shè)計(jì)師如何在設(shè)計(jì)中講好故事?

2021-7-2    資深UI設(shè)計(jì)者

講故事也是一種設(shè)計(jì)能力。

更多設(shè)計(jì)文章,設(shè)計(jì)交流,歡迎加入粉絲群 | 微信ddm7851

關(guān)注#公眾號(hào):SKY蓋哥 ,第一時(shí)間獲得設(shè)計(jì)干貨和分享內(nèi)容。

講故事也是一種設(shè)計(jì)能力

undefined


作為設(shè)計(jì)師,經(jīng)常需要和產(chǎn)品,技術(shù),老板去溝通設(shè)計(jì)方案,每次都是向外發(fā)出聲音表現(xiàn)你的的機(jī)會(huì),很可惜,大多數(shù)設(shè)計(jì)師在表達(dá)時(shí),對(duì)方還無法理解你的意思,更難理解你的設(shè)計(jì)概念和設(shè)計(jì)思路,很多設(shè)計(jì)師也因此害怕去說,其實(shí)設(shè)計(jì)師學(xué)會(huì)講故事非常重要,也是專業(yè)能力的一種。今天這篇文章,希望可以幫助到你。


undefined


能把設(shè)計(jì)說成故事是一門藝術(shù),作為設(shè)計(jì)師,我們必須借助講故事的方式,將產(chǎn)品功能推導(dǎo)到用戶價(jià)值層面,在大公司里面,設(shè)計(jì)師講故事是一個(gè)越來越重要的技能,一個(gè)好的故事能夠統(tǒng)一大家的建議,獲得領(lǐng)導(dǎo)的認(rèn)可,是將產(chǎn)品價(jià)值和功能流程和用戶的情感聯(lián)系在一起的關(guān)鍵!


看看別人怎么講故事


韓國(guó)的設(shè)計(jì),韓國(guó)很多潮流的娛樂視頻都是圍繞一個(gè)故事開始的,故事靈感也來源于大多數(shù)人生活,容易讓觀眾引起共鳴。


undefined

 


這個(gè)MV是來自Zion.T的Eat,講述了一個(gè)人在失落沮喪的時(shí)候,要照顧好自己,整個(gè)故事圍繞著我們生活中各種失落,孤單的情節(jié),再配合美妙的旋律,讓觀眾感同深受。
undefined
K.will的Day也是運(yùn)用電影短片講述一個(gè)故事,講述了一個(gè)單相思男生的故事,雖然故事很淺,但是每個(gè)故事的每一步都是來源于我們每個(gè)人生活當(dāng)中的。


undefined


在Airbnb宣傳頁面,運(yùn)用故事講述了一家3口,為了女兒的生日,一同飛往洛杉磯,他們?nèi)チ说鲜磕針穲@,在洛杉磯預(yù)訂了房源,受到了房東的歡迎!這樣宣傳比廣告更加真實(shí)打動(dòng)人。
故事驅(qū)動(dòng)的設(shè)計(jì)很容易入手,從情節(jié)提要開始,回歸用戶視角給出用戶想要的體驗(yàn)。


undefined


allthatisshe一個(gè)英文網(wǎng)站,這個(gè)網(wǎng)站最初是在博主休產(chǎn)假期間創(chuàng)辦的,它原本是一個(gè)很簡(jiǎn)單的時(shí)尚博客,但是博主異想天開的自我表達(dá)方案,以家庭小孩為主題的家庭故事,吸引了全世界的關(guān)注,在ins上關(guān)注度極高。


undefined

 


整個(gè)網(wǎng)站每篇文章都在描述博主和小朋友的生活故事,他們一家人相處的很多細(xì)節(jié),這中間再推薦一些好用的商品,去旅行帶著觀眾一起看風(fēng)景等!整個(gè)網(wǎng)站的故事一般都是從生活細(xì)節(jié)出發(fā),比如上班的路上,在品嘗美食,聽著喜歡的音樂時(shí)候,然后結(jié)合巧妙的內(nèi)容,吸引用戶。


講好故事的5個(gè)步驟

 


那么,作為設(shè)計(jì)師,平時(shí)在述職,總結(jié)時(shí)候如何去講故事呢?怎么去把一個(gè)合理的項(xiàng)目,通過敘事的方式,讓它能和聽眾引起共鳴呢?


undefined



今天分享給你,一個(gè)講故事的框架,一共有5步:

1.開始(背景)


2.沖突(問題)


3.情節(jié)(解決問題的過程)


4.高潮(設(shè)計(jì)策略)


5.行動(dòng)和結(jié)果(問題如何解決的,解決過程中發(fā)生了什么)

我們來拆解下這個(gè)思路。


更多設(shè)計(jì)文章,設(shè)計(jì)交流,歡迎加入粉絲群 | 微信ddm7851

關(guān)注#公眾號(hào):SKY蓋哥 ,第一時(shí)間獲得設(shè)計(jì)干貨和分享內(nèi)容。


1.開始(背景)


這個(gè)項(xiàng)目是如何開始的,它的整個(gè)商業(yè)背景是什么,要解決用戶的什么問題!在我們演講或分享時(shí)候,盡量在140字以內(nèi)描述清楚,整個(gè)項(xiàng)目的背景和簡(jiǎn)介,讓聽眾記住你。


undefined


喬布斯著名的演講家,他分享有個(gè)小技巧,就是可以先拋出問題和困惑!一次iPad2發(fā)布會(huì)時(shí)候,喬布斯一上臺(tái)就拋出幾個(gè)問題,大家對(duì)于iPad銷量很擔(dān)心,iPad被各種抄襲,蘋果怎么辦?在一開始就通過問題,吸引聽眾,然后引人入勝!


undefined



來看一個(gè)實(shí)際案例,來自Facebook相冊(cè)一個(gè)設(shè)計(jì)改版,在項(xiàng)目開始,設(shè)計(jì)師就介紹了整個(gè)項(xiàng)目背景,F(xiàn)acebook Photos是讓用戶更方便的分享他們的故事,分享他們的圖片,讓用戶生活豐富多彩!那么如何幫助用戶更加便捷,更快的分享照片,是這個(gè)項(xiàng)目的設(shè)計(jì)重點(diǎn)。


2.沖突(問題)


講一個(gè)好的故事很難,一定要有沖突和問題,就像看一部電影,一定要有反派存在,只有沖突明顯,觀眾才會(huì)覺得更有趣。那這個(gè)環(huán)節(jié)就需要我們把這次產(chǎn)品改版,最重要幾個(gè)問題給提煉出來。


undefined


以Facebook為例,F(xiàn)acebook相冊(cè)遇見的問題是,通過數(shù)據(jù)研究發(fā)現(xiàn),人們不愿意在Facebook中分享照片有以下幾個(gè)原因:


1.大家手機(jī)中的照片很多,不是為了分享而拍攝的!


2.選擇照片很難,比如自拍,一次拍了十幾張,選出一個(gè)最好的很費(fèi)時(shí)間


3.大家經(jīng)常忘記了分享

所以,在這個(gè)環(huán)節(jié),我們需要從生活場(chǎng)景去思考,用淺顯易懂的語言去講述當(dāng)前產(chǎn)品遇見的問題!


3.情節(jié)(解決問題的過程)


針對(duì)這些問題,設(shè)計(jì)師怎么去解決呢,在這個(gè)環(huán)節(jié),一定要充分把你整個(gè)設(shè)計(jì)過程的思考,詳細(xì)描述,比如設(shè)計(jì)師常用的情緒版,競(jìng)品分析,設(shè)計(jì)的形色字構(gòu)質(zhì)的思考都可以在這個(gè)環(huán)節(jié)表達(dá)清楚。


undefined


Facebook團(tuán)隊(duì),基于用戶研究數(shù)據(jù),和數(shù)據(jù)結(jié)果,決定先定出一些設(shè)計(jì)原則,通過設(shè)計(jì)原則和主張來解決之前發(fā)現(xiàn)的問題和沖突!于是這個(gè)過程和產(chǎn)品開發(fā)一起討論出來,設(shè)計(jì)的原則和目標(biāo):


1.幫助人們記住他們可以分享的故事


2.輕松快速的分享


3.設(shè)計(jì)一種新的布局方式,讓大家分享時(shí)候自豪,能夠吸引人!


undefined


然后展示了他們做的競(jìng)品分析,情緒板,以及一些設(shè)計(jì)探索的方向!比如做了十幾個(gè)原型圖,對(duì)于相冊(cè)的展示設(shè)計(jì)了很多概念方案,包括各個(gè)文件類型的展示方案(照片,文字,視頻,地圖)等等!


4.高潮(設(shè)計(jì)決策)


基于以上設(shè)計(jì)過程,就可以得出對(duì)應(yīng)的設(shè)計(jì)決策,再進(jìn)行詳細(xì)的方案設(shè)計(jì)展示。


undefined


重新設(shè)計(jì)了頁面框架,用戶的相冊(cè)框架圖來幫用戶更好的分類相冊(cè),同時(shí)在布局上對(duì)各種文件類型進(jìn)行分類,優(yōu)化相冊(cè)的瀏覽效率。


undefined


視覺設(shè)計(jì)時(shí)候,去掉不需要的設(shè)計(jì)元素,突出內(nèi)容,確保每一步都能是一個(gè)最佳的解決方案!


undefined


同時(shí)在視覺設(shè)計(jì)上進(jìn)行了很多創(chuàng)新探索,將相冊(cè)故事以膠片的形式呈現(xiàn)在頂部,讓用戶更愿意去分享。


undefined


在設(shè)計(jì)時(shí),考慮多端的統(tǒng)一性,針對(duì)不同端的展示效果,真正的保證設(shè)計(jì)的落地性!


Facebook這個(gè)設(shè)計(jì)環(huán)節(jié)就像我們電影的中間高潮部分,怎么去解決沖突的,如何定決策,并逐步去落地整個(gè)設(shè)計(jì)方案的!我們?cè)诠ぷ髦幸残枰谶@個(gè)環(huán)節(jié)很好闡述你根據(jù)設(shè)計(jì)策略,在設(shè)計(jì)上怎么去落地的,設(shè)計(jì)方案是什么樣的,最后上線是如何的。


5.行動(dòng)和結(jié)果


undefined


這個(gè)環(huán)節(jié)需要把你故事中遇見的問題拋出來,以及這些問題你是怎么去溝通解決的。

比如Facebook相冊(cè)問題,就遇見了新版本排期問題,無法一下子改完,那么設(shè)計(jì)師針對(duì)這個(gè)問題,設(shè)計(jì)了中間迭代的方案,一步一步迭代到最終,以及開發(fā)測(cè)試問題,擔(dān)心用戶情緒反彈比較大,分批次上線等等。


同時(shí),做這個(gè)項(xiàng)目你得到了哪些啟發(fā)和教訓(xùn),后續(xù)如何去避免等,最后的結(jié)果和上線后數(shù)據(jù)可以幫助我們驗(yàn)證設(shè)計(jì)的正確與否。這些設(shè)計(jì)過程中的細(xì)節(jié)問題和決策,是幫助我們豐富故事很重要的因素。


undefined


掌握好了這個(gè)框架,生活中很多事情都可以運(yùn)用這個(gè)框架去講,比如你要去和別人分享【設(shè)計(jì)師如何做簡(jiǎn)歷】就可以按照這個(gè)框架去講:


1.開始(故事背景和簡(jiǎn)介)


很多設(shè)計(jì)師找工作比較難,作品集發(fā)出去無人問津,原因是什么?是找工作人太多,還是大環(huán)境不好,那么如何提升作品集呢,怎么才能更快的讓你作品集脫穎而出。


2.沖突(問題)


通過查閱了幾百份設(shè)計(jì)作品集,發(fā)現(xiàn)一些問題,比如:版式同質(zhì)化,設(shè)計(jì)風(fēng)格單一,文字太多,飛機(jī)稿太多,這些是影響作品集質(zhì)量很大的問題,由于這些問題導(dǎo)致很多面試官看作品集時(shí)候看見類似基本都跳過了,所以才導(dǎo)致大家找工作難。


3.情節(jié)(解決問題的過程)


通過查看大公司的招聘信息,提取重要關(guān)鍵信息,比如設(shè)計(jì)趨勢(shì),數(shù)據(jù)研究,系統(tǒng)思考這些關(guān)鍵詞出現(xiàn)的比較多,同時(shí)查看了全球頂級(jí)設(shè)計(jì)師和韓國(guó)設(shè)計(jì)師作品集,發(fā)現(xiàn)好的作品集都是簡(jiǎn)約的,排版舒服的,那針對(duì)這些,你決定從這幾個(gè)問題去優(yōu)化作品集:


版式上往蘋果簡(jiǎn)約風(fēng)格去靠。設(shè)計(jì)風(fēng)格上貼近主流,優(yōu)化作品使得作品手法豐富,同時(shí)針對(duì)飛機(jī)稿太多,優(yōu)化線上案例,重新按照最新手法來做等。


4.高潮(設(shè)計(jì)策略)


花了一個(gè)月時(shí)間,去詳細(xì)設(shè)計(jì)你的作品集,同時(shí)設(shè)計(jì)完成后對(duì)比之前作品發(fā)現(xiàn)明顯的提升,同時(shí)設(shè)計(jì)的過程也掌握了一些設(shè)計(jì)趨勢(shì),再投遞的時(shí)候發(fā)現(xiàn)獲得面試的機(jī)會(huì)大于之前。


5.行動(dòng)和結(jié)果


最后獲得了一個(gè)大廠的offer,但是整個(gè)過程中是艱苦的,做作品集中間也遇見很多問題,比如沒有人指導(dǎo),不知道最新的趨勢(shì)是什么,比較焦慮,針對(duì)這些現(xiàn)狀當(dāng)時(shí)自己是如何調(diào)整的。


運(yùn)用這個(gè)框架簡(jiǎn)單的一個(gè)敘事,你會(huì)發(fā)現(xiàn)這樣的體系化思考能讓我們表達(dá)時(shí)候更上一層樓。


運(yùn)用XYZ公式講故事

 

undefined


當(dāng)我們向別人介紹一個(gè)新產(chǎn)品時(shí),無法切中要點(diǎn),明確表達(dá)產(chǎn)品用戶和概念,很多人會(huì)覺得「他們?cè)趺绰牪欢?,一定是他們理解有問題,不是我的問題」很不幸的是,問題就是在于我們的表達(dá)上,分享一個(gè)XYZ公式給大家。


undefined


分享給大家一個(gè)公式,掌握后,你就能輕松的給別人講清楚:


X:產(chǎn)品功能


Y:使用產(chǎn)品的目標(biāo)用戶


Z:這個(gè)產(chǎn)品賦予用戶的感受


這三個(gè)問題,與產(chǎn)品,開發(fā)的人都有關(guān)系,無論任何項(xiàng)目進(jìn)展,團(tuán)隊(duì)都能想起這個(gè)產(chǎn)品愿景,從而讓我們對(duì)產(chǎn)品輪廓更加清晰,同時(shí)這個(gè)公式的表達(dá)能讓團(tuán)隊(duì)外的人聽的懂。


舉個(gè)例子


undefined


X:微信一款通訊工具,支持單人、多人參與,通過手機(jī)網(wǎng)絡(luò)發(fā)送語音、圖片、視頻和文字;


Y:它的目標(biāo)用戶是使用手機(jī)的用戶;


Z:這個(gè)產(chǎn)品希望鏈接用戶生活方方面面,是一種新的生活方式。


undefined


X:支付寶一款支付工具,它融合了支付,生活服務(wù),保險(xiǎn),理財(cái)公益的生活服務(wù)平臺(tái) ;


Y:它的目標(biāo)用戶是互聯(lián)網(wǎng)用戶;


Z:這個(gè)產(chǎn)品希望給人親近、安全、可靠的感覺。


上述這個(gè)XYZ框架,能夠很好幫助你表達(dá)一個(gè)產(chǎn)品功能和定位,希望在你下次晉升或者述職向別人介紹時(shí),能夠用上。


最后

 

undefined


回顧下今天所分享的知識(shí)點(diǎn),如何很好的將你項(xiàng)目講成故事的5個(gè)步驟:


1.開始(背景)


2.沖突(問題)


3.情節(jié)(解決問題的過程)


4.高潮(設(shè)計(jì)策略)


5.行動(dòng)和結(jié)果(問題如何解決的,解決過程中發(fā)生了什么)


如何向別人準(zhǔn)確表達(dá)產(chǎn)品功能和愿景,XYZ公式:


X:產(chǎn)品功能


Y:使用產(chǎn)品的目標(biāo)用戶


Z:這個(gè)產(chǎn)品賦予用戶的感受。




藍(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)小助,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png


文章來源:站酷  作者:我們的設(shè)計(jì)日記

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

藍(lán)藍(lán)設(shè)計(jì)bouu.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ù)


分享本文至:

日歷

鏈接

個(gè)人資料

存檔