很多手機網(wǎng)站導(dǎo)航頁設(shè)計十分的精美，讓人情不自禁的繼續(xù)瀏覽下去，它們在你未使用產(chǎn)品之前提前告知你產(chǎn)品的主要功能與特點，第一次印象的好壞會極大地影響到后續(xù)的產(chǎn)品使用體驗。因此各個公司都在努力將這幾個頁面設(shè)計好，從一開始就引人入勝。那接下來我跟大家一起來探討關(guān)于引導(dǎo)頁的設(shè)計。

1、文案言簡意賅，突出核心。

根據(jù)愛爾蘭哲學(xué)家漢密爾頓觀察發(fā)現(xiàn)的7±2效應(yīng)，一個人的短時記憶至少能回憶出5個字，最多回憶9個，即7±2個。因此展示的文案要控制在9個字以內(nèi)，超過后用戶容易遺忘、出現(xiàn)記憶偏差。如果表達起來困難，可以輔助一小段文字進行解釋或補充。因此在最終文案的確定上，要突出重點，多余的文字盡可能地進行刪減。如果文案刪減后字數(shù)還是過多，因考慮對文字進行分層，通過空格或逗號或換行的方式進行視覺優(yōu)化。

精準貼切的文案也十分重要，將專業(yè)的術(shù)語轉(zhuǎn)換成用戶聽得懂的語言。尤其對于通過照片來表現(xiàn)主題的引導(dǎo)頁設(shè)計，文案與照片的吻合度，直接影響到情感傳達的效果。

產(chǎn)品設(shè)計 引導(dǎo)頁設(shè)計 用戶體驗

2、富于情感化

(1)文案具象化

通過具體的元素、場景來表現(xiàn)文案，采用寫實、半寫實的方式進行表現(xiàn)，有些應(yīng)用還會配以水彩風(fēng)格。以天貓為例，天貓是一款購物應(yīng)用，在設(shè)計上通過商場、店鋪的實際場景的具體描繪，渲染輕松、歡快的購物過程。

(2)頁面動效、頁面間交互方式的差異化

之前對于表現(xiàn)方式的歸類已經(jīng)講到了動畫及頁面切換方式，如果增加了頁面動效，利用動效，包括放大、縮小、平移、滾動、彈跳，表現(xiàn)形式更加多樣化，會讓引導(dǎo)頁更有趣，注意力更為集中。

而頁面間的切換方式除了傳統(tǒng)的卡片左右滑動的方式外，可以結(jié)合線條、箭頭等進行引導(dǎo)，通常會配合動效。例如網(wǎng)易新聞客戶端、印象筆記·食記，它們在引導(dǎo)頁的設(shè)計上采用了線條作為主線貫穿整個引導(dǎo)頁面，小圓點顯示當(dāng)前的瀏覽進度，滑動的過程中有滾動視差的效果。

3、視覺聚焦

在單個引導(dǎo)頁中，信息不宜過多，只闡述一個目的，所有元素都圍繞這個目的進行展開。視覺聚焦包括兩部分，一 是文案的處理，要注意層次，主標題與副標題要形成對比;二是引導(dǎo)頁中的界面、場景、文案具象化元素，要有一個視覺聚焦點，多個視覺元素的排布采用中心擴散 的方式，聚焦點的視覺面積大，同時與擴散的元素拉開對比。這樣用戶能清晰地看到核心文案信息與文案對應(yīng)的視覺表現(xiàn)元素。同時結(jié)合視線流動的規(guī)律，從上到 下，從左到右，從大到小。因此可以根據(jù)這個視線流的規(guī)律來進行引導(dǎo)頁的設(shè)計。

4、與產(chǎn)品、公司基調(diào)相一致

引導(dǎo)頁在視覺風(fēng)格與氛圍的營造上要與該產(chǎn)品、公司形象相一致，這樣在用戶還未使用具體產(chǎn)品前就給產(chǎn)品定下一個對應(yīng)的基調(diào)。產(chǎn)品的特性決定了引導(dǎo)頁的風(fēng)格，產(chǎn)品是消費類、娛樂類、工具類還是其他，根據(jù)不同的產(chǎn)品特性決定了引導(dǎo)頁是走輕松娛樂、小清新，還是規(guī)整、趣味性的風(fēng)格，在最終的表現(xiàn)形式上也就會有完全不同的展現(xiàn)，是插圖、界面、動畫還是其他。如淘寶的娛樂、豆瓣的清新文藝、百度的工具、蟬游記的休閑等等，通過對比就能發(fā)現(xiàn)他們在引導(dǎo)頁設(shè)計上的差異。

這樣一方面有利于產(chǎn)品一脈相承，與產(chǎn)品使用體驗相一致;另一方面也會進一步強化公司形象。

以來往為例，來往是一款針對個人用戶的及時通訊應(yīng)用，主打扎堆、閱后即焚、敲門等與微信不一樣有趣的功能，也是想給用戶創(chuàng)造不一樣的溝通方式。因此在引導(dǎo)頁的設(shè)計上通過趣味性、甚至有點搞怪的動作與表情來表現(xiàn)來往是這樣一款有趣、歡樂多的產(chǎn)品。

總之：想做好引導(dǎo)頁的設(shè)計，在理解用戶對引導(dǎo)頁需求的基礎(chǔ)上，懷揣熱愛產(chǎn)品的情懷，依靠精致的布局，巧妙的構(gòu)思，貼切的氛圍渲染，再加一點點特色。當(dāng)然光講是枯燥的，還是需要設(shè)計師在具體的設(shè)計中不斷實踐，總結(jié)出新的觀點與方法，探索出別具一格的引導(dǎo)頁設(shè)計。

新聞標題：重慶UI設(shè)計：手機網(wǎng)站導(dǎo)航頁的設(shè)計
文章地址：http://aaarwkj.com/news20/260670.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、靜態(tài)網(wǎng)站、全網(wǎng)營銷推廣、網(wǎng)站導(dǎo)航、服務(wù)器托管、品牌網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)