首頁(yè)

術(shù)語(yǔ)小科普!聊聊線框稿、視覺(jué)稿與原型的區(qū)別

周周

wireframe-mockup-prototype-differeces-1

@Akane_Lee :我和群里設(shè)計(jì)師聊,發(fā)現(xiàn) Prototype、Wireframe、Mockup 因?yàn)榉g有時(shí)候皆統(tǒng)稱為「原型」的關(guān)系,導(dǎo)致大混淆,所以來(lái)說(shuō)明下這三者的不同,不清楚這三個(gè)術(shù)語(yǔ)有什么區(qū)別的同學(xué)來(lái)漲姿勢(shì)咯 >>>

漲姿勢(shì)!有什么好的方案可以替代抽屜式導(dǎo)航?

周周

navigation-drawer-alternative-1

關(guān)于抽屜導(dǎo)航(三線icon/漢堡包菜單)的文章和討論已經(jīng)夠多了。本文無(wú)意加入這些討論,只是想尋找一種更好的替代方案,畢竟抽屜導(dǎo)航的缺陷早已成為公論 >>>

html5動(dòng)效系列一:10個(gè)HTML5美化版復(fù)選框和單選框

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

單選框Radiobox和復(fù)選框checkbox在網(wǎng)頁(yè)中也十分常見,雖然它沒(méi)有按鈕的交互性強(qiáng),但是如果能把它們像按鈕那樣美化一下,那也是非常不錯(cuò)的。本文收集了10個(gè)相對(duì)比較漂亮的美化版單選框和復(fù)選框,希望你會(huì)喜歡。

1、CSS3漂亮的自定義Checkbox復(fù)選框 9款迷人樣式

之前我們分享過(guò)一款非常不錯(cuò)的CSS3自定義checkbox復(fù)選框純CSS3美化Checkbox和Radiobox按鈕,外觀非常時(shí)尚。今天我們來(lái)分享一款9款樣式迷人的CSS3漂亮的自定義checkbox復(fù)選框。這幾款復(fù)選框樣式很豐富,使用起來(lái)也比較方便。

html5-css3-checkbox-styles

交互設(shè)計(jì)系列之六:富有啟發(fā)性的線框草圖

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



隨著公司企業(yè)對(duì)設(shè)計(jì)的重視越來(lái)越高。很多視覺(jué)設(shè)計(jì)師和交互設(shè)計(jì)師都有這非常明確的定位。不管是設(shè)計(jì)網(wǎng)站頁(yè)面還是應(yīng)用界面的風(fēng)格定位或者是移動(dòng)App的應(yīng)用交互等等。在設(shè)計(jì)過(guò)程中設(shè)計(jì)師都需要一個(gè)構(gòu)思的過(guò)程。有一部分設(shè)計(jì)師會(huì)通過(guò)一些交互軟件來(lái)做最前期的架構(gòu)和構(gòu)思。但是更多的設(shè)計(jì)師還是喜歡用最原生的方法來(lái)構(gòu)思——草圖!我想這應(yīng)該也是最原始的前期構(gòu)思了。把好的靈光一現(xiàn)瞬間畫在稿紙上,做好標(biāo)記。我們?cè)谑褂玫暮芏嘟?jīng)典的工具界面都有著最初的線框草圖。今天我們要分享的就是一些優(yōu)秀的線框示意草圖。你可以看到這些最初的設(shè)計(jì)雛形。相信你可以從中得到創(chuàng)意的靈感。

交互設(shè)計(jì)系列之五:一個(gè)好的交互設(shè)計(jì)師是怎樣成長(zhǎng)起來(lái)的?

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

1. 交互設(shè)計(jì)師應(yīng)當(dāng)具備的能力

如果我們簡(jiǎn)單的將用戶體驗(yàn)領(lǐng)域涉及到的技能分為:用戶研究、產(chǎn)品(概念/功能)設(shè)計(jì)、交互設(shè)計(jì)、視覺(jué)設(shè)計(jì)、工程技術(shù),我認(rèn)為任何一個(gè)交互設(shè)計(jì)師和視覺(jué)設(shè)計(jì)師等等,都應(yīng)該具有整體的復(fù)合技能,只是哪部分更多哪部分更少的問(wèn)題。

1) 用戶研究:對(duì)于交互設(shè)計(jì)師,不具備基本的用戶研究能力,無(wú)法吸收來(lái)自用戶的「信息營(yíng)養(yǎng)」,如何做出真正以用戶為重心的設(shè)計(jì)呢?觀察法、訪談法、問(wèn)卷法、可用性測(cè)試、行為數(shù)據(jù)分析等等,這些基本的方法應(yīng)該要有所掌握。

2) 產(chǎn)品(概念/功能)設(shè)計(jì)和交互設(shè)計(jì):這方面不必多說(shuō),交互設(shè)計(jì)師必須有大局觀,能夠真正的理解產(chǎn)品的思路和方向,從交互的角度實(shí)現(xiàn)產(chǎn)品層面的意圖。這也是很多交互設(shè)計(jì)師轉(zhuǎn)向產(chǎn)品設(shè)計(jì)師、產(chǎn)品經(jīng)理的原因,在很多方面有交叉。

3) 視覺(jué)設(shè)計(jì):視覺(jué)設(shè)計(jì)是很多交互設(shè)計(jì)師的軟肋,常常無(wú)法忍受一些交互設(shè)計(jì)師做出的沒(méi)有美感的文檔。現(xiàn)在,特別是在移動(dòng)互聯(lián)網(wǎng)的設(shè)計(jì)領(lǐng)域,交互和視覺(jué)往往是高度交叉的。交互會(huì)影響視覺(jué),視覺(jué)反過(guò)來(lái)也會(huì)影響交互。對(duì)于一個(gè)交互設(shè)計(jì)師,在做交互設(shè)計(jì)師,腦海中就應(yīng)該浮現(xiàn)出視覺(jué)的輪廓,為視覺(jué)設(shè)計(jì)留下能夠發(fā)揮的空間。另外,交互設(shè)計(jì)師一定要有很好的視覺(jué)設(shè)計(jì)的感覺(jué),知道如何判斷好的和不好的視覺(jué)設(shè)計(jì)。像素眼(能夠通過(guò)肉眼分辨出一像素的差別)至少要具備吧?

交互設(shè)計(jì)系列之四:交互設(shè)計(jì)師,你要懂視覺(jué)!

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

 

  交互設(shè)計(jì)師之所以要懂得視覺(jué)語(yǔ)言,主要體現(xiàn)在原型制作的工作部分,

  因?yàn)檩敵龅碾m然是低保真原型,但低保真原型的設(shè)計(jì)過(guò)程其實(shí)也是一個(gè)視覺(jué)化過(guò)程。

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

日歷

鏈接

個(gè)人資料

存檔