首頁(yè)

交互設(shè)計(jì)師不僅僅是個(gè)畫破圖的!

藍(lán)藍(lán)設(shè)計(jì)的小編

2011年10月,相繼寫了兩篇《交互設(shè)計(jì)那些事兒》(一)(二),至今已經(jīng)有兩年了。期間有不少新的想法伴隨著我的工作、交流涌現(xiàn)出來,加上幾周前,在新的團(tuán)隊(duì)又進(jìn)行了一次分享,頗有點(diǎn)心得,又懶得去重新修改原有文章,就在此進(jìn)行一些補(bǔ)錄吧。

還是個(gè)人經(jīng)驗(yàn),眼界有限,歡迎拍磚。

一. 再談術(shù)語

面向?qū)换ケ容^陌生的團(tuán)隊(duì)進(jìn)行分享,少不得再介紹下那些讓人云里霧里的術(shù)語。這次,咱們?yōu)檫@些術(shù)語做一個(gè)關(guān)系圖:

2013-05-27_182443

 

從下至上是各種術(shù)語的演變史。中間代表“做的事情”,左邊代表做這件事情的“人”,右邊代表做這件事情需要的“指導(dǎo)思想”。

如何成為一個(gè)好的交互設(shè)計(jì)師?

藍(lán)藍(lán)設(shè)計(jì)的小編

了解自己的學(xué)習(xí)特性

一個(gè)好的交互設(shè)計(jì)師往往了解自己學(xué)東西的特殊方式,并善加利用,所以有著較有效率、較明顯的成長(zhǎng)。

學(xué)習(xí)與成長(zhǎng)并不是件陌生的事,每個(gè)人都有自己的故事。試著回想你學(xué)習(xí)其他東西的行為與習(xí)慣,透過一些整理,你可以逐步認(rèn)識(shí)自己是怎樣的學(xué)習(xí)者,并試著讓你的團(tuán)隊(duì)知道與支持你。這可以是了解如何成長(zhǎng)的第一步。身為一個(gè)設(shè)計(jì)團(tuán)隊(duì)的領(lǐng)導(dǎo),也能在更了解組員的學(xué)習(xí)特性之后,一起創(chuàng)造出更合適的學(xué)習(xí)環(huán)境。

舉個(gè)例子:

  • 某設(shè)計(jì)師的學(xué)習(xí)特性是…
  • 我沒有辦法只看書或理論而產(chǎn)生我的設(shè)計(jì)觀點(diǎn),我是一個(gè)從做中學(xué)的交互設(shè)計(jì)師。
  • 不好玩、不友善的學(xué)習(xí)環(huán)境,我學(xué)不起來。

交互設(shè)計(jì)師,你要懂視覺

交互設(shè)計(jì)師之所以要懂得視覺語言,主要體現(xiàn)在原型制作的工作部分,
因?yàn)檩敵龅碾m然是低保真原型,但低保真原型的設(shè)計(jì)過程其實(shí)也是一個(gè)視覺化過程。

廢話少說,直接解釋吧(大致按照動(dòng)手的時(shí)間順序,以數(shù)字媒體界面為例)。


1 設(shè)計(jì)界面框架要懂視覺
在定好功能,搭好信息架構(gòu)之后,一般進(jìn)行單獨(dú)界面的框架設(shè)計(jì)(鬼扯,真實(shí)的操作順序誰知道?。?/span>
框架設(shè)計(jì)是元素在界面上的大致布局,界面分幾塊區(qū)域,哪一塊區(qū)域放什么內(nèi)容之類的。
這里需要交互設(shè)計(jì)師確定這么幾件跟視覺有關(guān)的事情:

用戶到達(dá)頁(yè)面才是設(shè)計(jì)的開始

藍(lán)藍(lán)設(shè)計(jì)的小編

很久之前認(rèn)為一個(gè)項(xiàng)目的完成和上線是一個(gè)項(xiàng)目的完結(jié),
后來認(rèn)識(shí)到,一個(gè)項(xiàng)目或頁(yè)面的上線不是結(jié)束而僅僅是開始,
現(xiàn)在明白了,用戶到達(dá)頁(yè)面,我們的設(shè)計(jì)才是剛剛開始。

我不敢說是絕對(duì)的或者百分百,但是用戶到達(dá)該頁(yè)面、該網(wǎng)站、使用該產(chǎn)品,這之前更多的依靠的是搜索或者運(yùn)營(yíng)的推廣。作為負(fù)責(zé)部分項(xiàng)目的UE/UI設(shè)計(jì)師來說,我不是產(chǎn)品,不是項(xiàng)目經(jīng)理,更不是運(yùn)營(yíng)和廣告我沒有那么多的能力去干預(yù)用戶到達(dá)或者使用我的設(shè)計(jì)。

 
下面單說一下我理解的用戶到達(dá)頁(yè)面的三種狀態(tài)。
我認(rèn)為一個(gè)頁(yè)面瀏覽行為可以分為:瀏覽前、瀏覽中、瀏覽后,三個(gè)階段。

 
初級(jí)設(shè)計(jì)師或者是產(chǎn)品亦或是互聯(lián)網(wǎng)工作人員大多認(rèn)為:瀏覽中才是我要做的,要花心思做的。
點(diǎn)擊查看原圖

如何打造軟件、應(yīng)用類shopping mall

藍(lán)藍(lán)設(shè)計(jì)的小編

 2011年各大移動(dòng)應(yīng)用商店迅速崛起,群雄割據(jù)。在移動(dòng)應(yīng)用商店的基礎(chǔ)上,軟件商店也悄然形成。這些軟件、應(yīng)用類商店形式多樣、風(fēng)格迥異。一些成功的應(yīng)用商店都已然向“shopping mall“邁進(jìn):比如應(yīng)用商店的大贏家蘋果APP Store(i Pad、iPhone), 國(guó)內(nèi)的安卓市場(chǎng)、網(wǎng)易應(yīng)用、騰訊應(yīng)用中心等等。這些商店成功的秘訣在于他們不僅僅將產(chǎn)品定位于一個(gè)簡(jiǎn)單的提供應(yīng)用下載的工具,而是精心運(yùn)營(yíng)和設(shè)計(jì),創(chuàng)造出一站式提供應(yīng)用服務(wù)的場(chǎng)所。

  怎樣的軟件應(yīng)用類商店是最完善的呢? 如何使軟件應(yīng)用類“商店”提升為“shopping mall”呢?對(duì)此,本文從shopping mall的規(guī)劃原則著手,找尋其與軟件應(yīng)用商店的共通點(diǎn)。通過任務(wù)和場(chǎng)景對(duì)現(xiàn)有的幾大應(yīng)用商店進(jìn)行分析,提煉軟件應(yīng)用類商店的設(shè)計(jì)要素。

  Shopping mall的定義是:大型零售業(yè)為主體,眾多專業(yè)店為輔助業(yè)態(tài)和多功能商業(yè)服務(wù)設(shè)施形成的聚合體。而一個(gè)完善的軟件應(yīng)用類商店應(yīng)該是集倉(cāng)儲(chǔ)、商場(chǎng)、服務(wù)與一身的軟件應(yīng)用中心。就如一個(gè)完善的購(gòu)物中心,銷售的是種類各異的軟件。下圖從角色、任務(wù)和場(chǎng)景3個(gè)方面對(duì)shopping mall和軟件、應(yīng)用商店進(jìn)行對(duì)比分析。

 

 

界面設(shè)計(jì)中的結(jié)構(gòu)設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編

構(gòu)建界面視覺層級(jí)的元素有顏色的顯著程度,圖片、文字的尺寸大小,還有最基礎(chǔ)的,內(nèi)容的組織結(jié)構(gòu)。

結(jié)構(gòu)設(shè)計(jì)是指對(duì)界面內(nèi)容進(jìn)行分組,對(duì)界面中的信息、數(shù)據(jù)進(jìn)行設(shè)計(jì)使之結(jié)構(gòu)化呈現(xiàn)的過程。

好的結(jié)構(gòu)設(shè)計(jì)能使界面信息傳達(dá)更加清晰、快捷。那么,如果進(jìn)行結(jié)構(gòu)設(shè)計(jì)呢?

qq訂票頁(yè)面交互的一些看法

藍(lán)藍(lán)設(shè)計(jì)的小編

本部分將結(jié)合已經(jīng)上線的QQ旅游訂票系統(tǒng)的分析,給出解決方案

系統(tǒng)郵件體驗(yàn)設(shè)計(jì)

藍(lán)藍(lán)設(shè)計(jì)的小編

每天我的郵箱都會(huì)收到很多系統(tǒng)郵件。有些是網(wǎng)購(gòu)訂單的狀態(tài)通知,有些是網(wǎng)站活動(dòng)宣傳,有些是社交網(wǎng)站消息提醒。相信大家也都有和我一樣的煩惱:怎么老是這么多垃圾郵件!淹沒掉我重要的郵件啦!煩死啦??!你們有沒有為我們著想啊??! 其實(shí)從交互的交互來看這些郵件,還是有很多的學(xué)習(xí)地方的,俗話說:三人行,必有我?guī)熝?。擇其善者而從之,其不善者而改之。所以今天我們來一起從分析下這些郵件。

我們先來普及郵件的幾個(gè)概念棕色字摘抄于同事heidi的博文 —— 讓電子郵件更給力 ):

幾個(gè)重要的假設(shè)前提

     1. 很少有人愿意閱讀長(zhǎng)郵件 ——除非你告訴他不讀會(huì)怎么樣,賦予他責(zé)任

     2. 很少有人愿意無理由主動(dòng)做什么事情 ——特別可做可不做時(shí),除非價(jià)值觀特別好,喜歡多管閑事

      3.很少有人會(huì)仔細(xì)閱讀你的郵件 ——千萬不要發(fā)一封面向很多人的郵件,然后指望大家都在里面仔細(xì)閱讀找出你期待他做什么事情。

不好的郵件特征

    1.寫成散文,長(zhǎng)而枯燥,又期待人去閱讀——這是不現(xiàn)實(shí)的  

      2.重點(diǎn)不突出,反而依賴收件人去提取關(guān)鍵信息:時(shí)間、行動(dòng)、目標(biāo)

     3.群發(fā),導(dǎo)致郵件無針對(duì)性——《影響力》一書的觀點(diǎn)時(shí),如此會(huì)導(dǎo)致責(zé)任感被稀釋和分散,發(fā)送的人越多,真正有價(jià)值的回應(yīng)會(huì)越少

與此對(duì)應(yīng),好的電子郵件應(yīng)該讓收件人一眼就掃到 重點(diǎn):是什么,作為收件人,我需要在什么時(shí)間做什么。

我們對(duì)系統(tǒng)郵件給一個(gè)區(qū)分:1.不必要處理郵件(純宣傳郵件),2.必要處理郵件(購(gòu)物訂單狀態(tài)通知),3.可選處理郵件(社交網(wǎng)站消息提醒)

交互細(xì)節(jié)分析——分頁(yè)

藍(lán)藍(lán)設(shè)計(jì)的小編

交互細(xì)節(jié)分析-分頁(yè)
 

說說目前常用的三種分類顯示信息方法:

常規(guī)翻頁(yè)          信息滾動(dòng)翻頁(yè)         滾動(dòng)條

前者是橫向翻頁(yè)方式,后兩者是縱向的信息翻頁(yè)。分頁(yè)作為很小的一個(gè)組件,大多數(shù)網(wǎng)站都不會(huì)花費(fèi)什么精力去設(shè)計(jì),設(shè)計(jì)也大同小異,用戶已經(jīng)使用習(xí)慣學(xué)習(xí)成本為0,但如果能夠在細(xì)節(jié)上做的更細(xì)致貼心一些,用戶的使用體驗(yàn)會(huì)有所提升。

交互細(xì)節(jié)分析——注冊(cè)&登錄

藍(lán)藍(lán)設(shè)計(jì)的小編

交互細(xì)節(jié)分析——注冊(cè)&登錄

        注冊(cè)&登錄是一個(gè)網(wǎng)站的門戶,它的設(shè)計(jì)姿態(tài)就是對(duì)待客人的態(tài)度。雖然用戶可能每次都只花極少的時(shí)間在注冊(cè)&登錄互 動(dòng),但是這個(gè)“瞬間”卻舉足輕重,用戶與注冊(cè)&登錄之間的交互關(guān)系承上啟下的一個(gè)節(jié)點(diǎn)。注冊(cè)&登錄所有的細(xì)節(jié)影響了能否完成產(chǎn)品戰(zhàn)略定位 所設(shè)定的最基本任務(wù)去吸納其所希望的用戶的使命?;诤芏嘟换ピO(shè)計(jì)前輩的研究,作了一些細(xì)節(jié)中的細(xì)節(jié)分析。感謝身邊幫助我的朋友們。

日歷

鏈接

個(gè)人資料

存檔