首頁

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

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

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

我不敢說是絕對(duì)的或者百分百,但是用戶到達(dá)該頁面、該網(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á)頁面的三種狀態(tài)。
我認(rèn)為一個(gè)頁面瀏覽行為可以分為:瀏覽前、瀏覽中、瀏覽后,三個(gè)階段。

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

案例學(xué)習(xí) - 我們?cè)谠O(shè)計(jì)iPhone應(yīng)用時(shí)犯過的錯(cuò)誤

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

今年,我們(英文原文作者及團(tuán)隊(duì))發(fā)布了FreshBooks 的第一款iPhone應(yīng)用。從前我們的產(chǎn)品一直是通過Web端應(yīng)用的方式提供服務(wù)的。這次,我們把iPhone應(yīng)用的設(shè)計(jì)開發(fā)過程看作一張空白的花布,盡力在其中實(shí)現(xiàn)一些新的功能概念和設(shè)計(jì)想法。在這個(gè)過程中,我們著實(shí)學(xué)到不少東西。

不要害怕犯錯(cuò)

對(duì)于移動(dòng)應(yīng)用這樣的產(chǎn)品,設(shè)計(jì)過程中必然會(huì)遇到很多用戶體驗(yàn)方面的問題與挑戰(zhàn),尤其是對(duì)于新手來說更是如此。

無論你的線框稿在邏輯上有多縝密,UI稿在視覺上有多漂亮,當(dāng)它們落實(shí)成為原型或最終產(chǎn)品時(shí),總會(huì)有問題呈現(xiàn)出來。這并不完全是壞事;我們?cè)谠O(shè)計(jì)FreshBooks的iPhone應(yīng)用時(shí)甚至將犯錯(cuò)這件事也納入到了流程規(guī)劃當(dāng)中,這就意味著:

  • 坦承沒有完美的設(shè)計(jì),無論稿件和原型多么優(yōu)秀。
  • 真正的成功或失敗都是由用戶的反饋來定義的。
  • 對(duì)于在設(shè)計(jì)過程中看到的問題要迅速做出反應(yīng),根據(jù)從實(shí)際用戶身上得來的驗(yàn)證結(jié)果進(jìn)行迭代。

接下來,我將向各位描述一下我們?cè)陧?xiàng)目中犯過的三個(gè)錯(cuò)誤,以及我們是怎樣解決這些問題的。

應(yīng)用的主界面

在項(xiàng)目開始的時(shí)候,我們對(duì)FreshBooks的一些現(xiàn)有用戶進(jìn)行了訪談,了解他們?cè)谏詈凸ぷ髦惺窃鯓邮褂靡苿?dòng)設(shè)備的,包括他們面對(duì)的實(shí)際問題,以及他們對(duì)移動(dòng)應(yīng)用版本的FreshBooks的期望。

根據(jù)這些訪談,我們歸納出了一些基本的設(shè)計(jì)原則,例如下面這條:

以任務(wù)為中心的用戶體驗(yàn)

移動(dòng)應(yīng)用版本的產(chǎn)品應(yīng)該圍繞著一系列互不相關(guān)的帳單任務(wù)進(jìn)行優(yōu)化,包括時(shí)間追蹤、為收據(jù)拍照存檔、開票等等,這些是移動(dòng)應(yīng)用所處的使用場(chǎng)景當(dāng)中最常見的任務(wù)。

而其他方面的復(fù)雜任務(wù),包括批量編輯、權(quán)限管理、定制化等,則留給傳統(tǒng)的Web端應(yīng)用來承擔(dān),以此來保證移動(dòng)版本在功能上的簡(jiǎn)約與集中。

基于這條原則,我們?cè)O(shè)計(jì)了應(yīng)用的主界面。它由一系列最重要的任務(wù)組成,視覺上采用圖標(biāo)加文字標(biāo)題的形式,點(diǎn)擊進(jìn)入相應(yīng)的任務(wù)流程。例如,用戶點(diǎn)擊了其中的“創(chuàng)建新發(fā)票”之后會(huì)進(jìn)入發(fā)票列表界面,然后創(chuàng)建新發(fā)票的界面會(huì)自動(dòng)滑入視圖。

點(diǎn)擊查看原圖

這種以典型任務(wù)為中心的設(shè)計(jì)思路在意圖上是好的,但接下來我們發(fā)現(xiàn)了一些問題。

和用戶談戀愛——愛情三角理論與用戶黏性

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

親密是愛情關(guān)系中的溫暖體驗(yàn),是一種朋友般的親近。由于真正喜歡和對(duì)方在一起,渴望同對(duì)方一道建立更有凝聚力的和諧關(guān)系,希望把自己的生活以坦誠(chéng)、不設(shè)防的方式與對(duì)方分享。伴侶間會(huì)發(fā)展出屬于兩個(gè)人的溝通風(fēng)格,熟悉彼此不完美的個(gè)性。親密令戀人互相關(guān)心,善待對(duì)方,滿足彼此的需要和欲望。親密沒有激情強(qiáng) 烈,但能促進(jìn)戀人相互親近,讓人感受到人際溫暖。

30枚飆升你創(chuàng)造力的網(wǎng)頁設(shè)計(jì)

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

在激活你的創(chuàng)造力之前,我先來說一個(gè)普遍現(xiàn)象:從事設(shè)計(jì)這個(gè)職業(yè),當(dāng)沒有創(chuàng)意的時(shí)候怎么辦?會(huì)懊惱驚慌失措?覺得自己不適合這個(gè)職業(yè)嗎?騷年菇?jīng)鰝儯灰@慌!這種創(chuàng)意空白現(xiàn)象會(huì)發(fā)生在任何一個(gè)腦力工作者身上。那一刻抱著頭的你,肯定痛苦不已的覺得自己失去了所有才干,沮喪的覺得沒有在行業(yè)里繼續(xù)發(fā)展的能力,乃至永遠(yuǎn)都不會(huì)再創(chuàng)造出很酷的設(shè)計(jì)。

其實(shí)我要告訴你:這一切都是正常的。在我們的某些時(shí)期某些時(shí)刻,每一個(gè)設(shè)計(jì)師都會(huì)倏然經(jīng)歷這樣的苦惱,聽我說,你絕對(duì)不是一個(gè)人在戰(zhàn)斗!

但我們?nèi)绾慰朔@些感受?找到靈感呢!很多前輩都教導(dǎo)我們說,想要有創(chuàng)造力,必須先讓自己產(chǎn)生某種身心的愉悅!

高端設(shè)計(jì)盛宴FRAME-FPA論壇在北京完美落幕

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

 

高端設(shè)計(jì)盛宴FRAME-FPA論壇于2012年12月15日晚在北京東隅酒店完美落幕。

 

由《FRAME國(guó)際空間設(shè)計(jì)雜志》和新西蘭廚房電器品牌FisherPaykel斐雪派克聯(lián)合發(fā)起的集結(jié)高端設(shè)計(jì)、生活意見、美食分享和社交活動(dòng)的FPA論壇繼在北京+86設(shè)計(jì)博物館、上海源創(chuàng)創(chuàng)意園、深圳派意館成功舉辦后,于2012年年末回歸北京,與設(shè)計(jì)界的朋友再次相聚,共享年終設(shè)計(jì)盛宴。

pantone把綠寶石色作為2013年的年度顏色

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

 

色彩公司pantone 最近選擇了綠寶石色(emerald17-5641 )作為2013 年的年度顏色,在他們的描述中,綠寶石色 生動(dòng),光芒四射,有魅力…… 是一種代表了優(yōu)雅和美麗的顏色,加強(qiáng)了我們個(gè)人的自然存在感,帶給我們平和心態(tài)

藍(lán)注:今年prada 新款綠色寶石的裙子, 也特別的漂亮!孫儷穿過,從者眾!

點(diǎn)擊查看原圖

分享廣告設(shè)計(jì)圈線下活動(dòng)專題好網(wǎng)站:第九課堂

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

藍(lán)藍(lán)寫

分享廣告設(shè)計(jì)圈線下活動(dòng)專題好網(wǎng)站:第九課堂http://www.dijiuke.com/。

挺好!周六日及空余時(shí)間可以多學(xué)學(xué)、看看!

點(diǎn)擊查看原圖

案例學(xué)習(xí) - 響應(yīng)式網(wǎng)站的產(chǎn)品需求和設(shè)計(jì)流程詳解

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

根據(jù)DailyTech的統(tǒng)計(jì),到2015年,移動(dòng)互聯(lián)網(wǎng)的用戶數(shù)量將會(huì)超過桌面用戶。除了智能手機(jī)之外,使用平板電腦甚至是電視機(jī)進(jìn)行上網(wǎng)的用戶也在持續(xù)增加。在這種形勢(shì)下,怎樣讓我們的網(wǎng)站盡量兼容各種類型的設(shè)備,并確保優(yōu)良的用戶體驗(yàn),這將是越來越重要的問題。

通過響應(yīng)式的設(shè)計(jì)開發(fā)方式,我們可以使網(wǎng)站頁面隨瀏覽設(shè)備的不同而自行響應(yīng),動(dòng)態(tài)的調(diào)整布局結(jié)構(gòu)、元素規(guī)格樣式,將相同的內(nèi)容以不同的格式呈現(xiàn)給不同設(shè)備的用戶。

如果你對(duì)響應(yīng)式Web設(shè)計(jì)還不大了解,可以先參考閱讀我們之前的關(guān)于響應(yīng)式設(shè)計(jì)的概念、組成要素及基本實(shí)現(xiàn)思路 方面的文章,全方位預(yù)熱一下。

什么情況下適宜采用響應(yīng)式Web設(shè)計(jì)的方式

當(dāng)客戶提出產(chǎn)品功能移動(dòng)化的需求時(shí),有一些解決方案可供我們選擇,包括原生客戶端應(yīng)用、Web應(yīng)用等;究竟怎樣的方式更合適,還是取決于具體的需求情況。另外也要考慮網(wǎng)站本身是否需要實(shí)施移動(dòng)化。雖然響應(yīng)式站點(diǎn)并不能算是一種純粹的移動(dòng)化解決方案,但是,在某些情況下,這種方式是非常值得考慮的。

你心里沒譜

設(shè)計(jì)開發(fā)一個(gè)全新的移動(dòng)版本站點(diǎn)或是客戶端應(yīng)用,整個(gè)過程是有很大挑戰(zhàn)性的。除非產(chǎn)品正式上線,否則你無法真正了解它是否會(huì)成功。與其單純的為了移動(dòng)化而花費(fèi)資源打造移動(dòng)版本站點(diǎn)或是開發(fā)客戶端應(yīng)用,不如先花些心思將原本的網(wǎng)站打造的更具彈性,使其在各種主流移動(dòng)設(shè)備中都擁有盡量?jī)?yōu)秀的用戶體驗(yàn)。

你想節(jié)約成本

要打造響應(yīng)式站點(diǎn),自然離不開有經(jīng)驗(yàn)的交互、視覺設(shè)計(jì)及前端開發(fā)人員。所需的資源,尤其是時(shí)間方面,比起普通網(wǎng)站來說大約增加20%到30%的樣子;但比起單獨(dú)打造移動(dòng)版本的網(wǎng)站,或是設(shè)計(jì)開發(fā)客戶端應(yīng)用的成本來說,卻要低很多。從維護(hù)的角度來說,也會(huì)輕松很多。

你希望網(wǎng)站可以兼容未來的新設(shè)備

所謂的移動(dòng)版本站點(diǎn),通常是針對(duì)某類具體規(guī)格的設(shè)備進(jìn)行單獨(dú)打造的,彈性比較差。新的移動(dòng)設(shè)備層出不窮,傳統(tǒng)的移動(dòng)版本站點(diǎn)需要不斷的進(jìn)行更新維護(hù),才能盡量保證在新設(shè)備中工作良好。響應(yīng)式設(shè)計(jì)可以根據(jù)設(shè)備瀏覽環(huán)境的具體規(guī)格進(jìn)行判斷,使用不同的呈現(xiàn)方式來展示內(nèi)容,無需針對(duì)某種特定的規(guī)格進(jìn)行維護(hù),適應(yīng)性更好。

表單設(shè)計(jì)與轉(zhuǎn)化率的提升

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

 

無論是用于注冊(cè)、支付還是聯(lián)絡(luò),我們總是需要通過表單來獲取用戶的信息。不幸的是,在現(xiàn)實(shí)當(dāng)中,總會(huì)有很多訪問者一見到表單就會(huì)立刻點(diǎn)擊瀏覽器上的后退按鈕。這里面原因有很多,例如表單篇幅太長(zhǎng)、不大友好、不那么值得信任,或是用戶還沒真正準(zhǔn)備好進(jìn)行交易等等。

這種情況每發(fā)生一次,我們就失掉了一個(gè)潛在用戶。怎樣將表單設(shè)計(jì)的讓盡量多的訪問者更愿意完成填寫,這是設(shè)計(jì)師們必須面對(duì)的挑戰(zhàn)。站在用戶的角度,我們可以將問題分為四個(gè)方面。

我能得到什么?

一提到“轉(zhuǎn)化”,設(shè)計(jì)師們首先想到的往往是一些相關(guān)操作的細(xì)節(jié)問題,包括按鈕的顏色、標(biāo)題的字號(hào)、對(duì)比度、對(duì)其方式等等。當(dāng)然,這些是必須考慮的,但最最首要的問題是:作為網(wǎng)站的訪問者,我為什么要填寫表單?我能得到什么?

訪問者不會(huì)簡(jiǎn)單的因?yàn)槟闾岢隽讼嚓P(guān)要求而把自己的個(gè)人信息透露給你;你要讓他們看到這樣做的好處在哪里。不妨把這件事看作一種交易,你的訪問者提供他們的名字與郵箱地址,從而換取到一些他們需要的東西,例如享受服務(wù)、免費(fèi)試用軟件、下載PDF文檔等等。

點(diǎn)擊查看原圖

除了讓瀏覽者知道他們能得到什么東西以外,你最好還能告訴他們這東西為什么是他們所需要的。要聚焦在產(chǎn)品的價(jià)值上,如果你能用最簡(jiǎn)單的介紹文字描述出你的產(chǎn)品能幫用戶解決怎樣的問題,喚起他們的共鳴,那么即使表單本身稍微復(fù)雜些,他們也會(huì)愿意完成填寫;否則,字段最少的表單也不會(huì)引起他們的興趣。

年度最佳的30個(gè)名片設(shè)計(jì)

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

 某國(guó)外設(shè)計(jì)網(wǎng)站連續(xù)12個(gè)月評(píng)選出月度精選名片設(shè)計(jì)之后,在年底推出了年度最佳的30個(gè)名片設(shè)計(jì)。在這30個(gè)入選的名片中,造型感突出的名片顯然比較受歡迎,尤其是與各自行業(yè)相關(guān)的創(chuàng)意名片讓人驚喜不已。 
 

ade_chong005.jpg

日歷

鏈接

個(gè)人資料

存檔