干貨推薦|40款獨特的移動導航用戶界面

3 評論 13161 瀏覽 193 收藏 10 分鐘

越是簡易,你的APP/網(wǎng)站就越出色。移動用戶的界面可以有很多種形式和風格。

提起設(shè)計APP,最重要的就是導航了。無論是應(yīng)用在臺式機,還是移動設(shè)備,導航都必須得直觀、有趣。水平的、垂直的、簡約的或者詳盡的,設(shè)計上都必須給人以美感,同時能真正起到合理的作用,達到預期的效果。APP的設(shè)計必須立足于用戶,一絲不茍于每一個細節(jié),讓用戶都能輕而易舉上手使用。一旦你實現(xiàn)了這一點,你就已經(jīng)設(shè)計出了非常功能化及人性化的產(chǎn)品。

越好的APP/網(wǎng)站,用戶需要操作的就越少。越是能讓用戶更簡單的使用,無論產(chǎn)品的注重點是在銷售,形式,還是讓客戶通過APP/網(wǎng)站進行各種信息的共享,都能更好的轉(zhuǎn)換。同時,如果用戶能有一個愉快的操作經(jīng)歷,他們才會有可能繼續(xù)使用這款APP,并且推薦給其他人。作為一個設(shè)計師,要把這個當成優(yōu)先重點,盡一切可能讓用戶以最簡易的方式瀏覽你的APP/網(wǎng)站,你其實已經(jīng)事半功倍了。

好的移動導航,你必須堅持這些基本,然而卻是最重要的原則。具體表現(xiàn)在它的外形、簡潔、一致性、互動性、風格以及可達性。APP/網(wǎng)站必須有一個清晰、簡潔的外觀,在不會混淆用戶注意力,即促進導航的前提下,你可以加入自己獨特的風格。簡潔是關(guān)鍵,是基本要素。但不等于無趣,就做成和其它的APP一樣。記住,想脫穎而出讓用戶駐足并提高參與,你的設(shè)計里所有的頁面必須始終如一地使用相同的導航模塊,使其最大程度上互相作用,讓用戶清楚自己身處何處,一直在做于何事(當有人暫停鼠標時,改變字體顏色,加黑體字,并添加簡短行為描述。)最后,確保你的用戶導航在任何設(shè)備上都能使用流暢,這樣所有人都能快速登錄來測試你的設(shè)計。

在這里,當你面對一個UI設(shè)計項目,你有40款獨特的移動導航用戶界面可以作為靈感。這些APP都是遵守了上述原則的優(yōu)秀設(shè)計案例,有報價APP、健身APP、任務(wù)管理APP、旅游APP等等。如果你正趕著最后期限,沒有時間從零開始設(shè)計,你可以使用其中的一些APP進行一些個人或者商業(yè)的用途。

Snap Task

Snap-Task

Fitness App UI

Fitness-App-UI

Volcano App (Folded menu)

Volcano-App-(Folded-menu)

Menu

Menu

BFC Partners Mobile

BFC-Partners-Mobile

Portfolio App

Portfolio-App

Side Menu

Side-Menu

Project Manager

Project-Manager

Mobile Dropdown Slider

Mobile-Dropdown-Slider

Side menu animation

Side-menu-animation

English Cards Animation

English-Cards-Animation

Quotes app (Sketch freebie)

Quotes-app-(Sketch-freebie)

Travel App

Travel-App

Menu by Frantisek Kusovsky

Menu-by-Frantisek-Kusovsky

Slide Menu (code)

Slide-Menu-(code)

iPhone App Design /// Opened Menu

iPhone-App-Design-Opened-Menu

MetroLite App

MetroLite-App

Fantasy Leagues App

Fantasy-Leagues-App

iOS Menu Concept

iOS-Menu-Concept

Medium for iPhone

Medium-for-iPhone

Mixpanel Navigation Menu Icons/UI

Mixpanel-Navigation-Menu-Icons-UI

Keezy menu

Keezy-menu

Menu Concept 1

Menu-Concept-1

GIF: Menu animation

GIF-Menu-animation

‘Scout’ home screen

'Scout'-home-screen

Nextr filter settings

nextr-filter-settings

Nav

Nav

Public Transportation iPhone App

Public-Transportation-iPhone-App

App Media Mockup

App-Media-Mockup

Mobile Menu

Mobile-Menu

WhatsApp Redesign [Unofficial]

WhatsApp-Redesign-[Unofficial]

SideMenu Real Pixels by Tomas Jasovsky

SideMenu-Real-Pixels-by-Tomas-Jasovsky

Menu slider/ feed screen

Menu-slider--feed-screen

The Flyer app – Profile and Sidebars

The-Flyer-app---Profile-and-Sidebars

Dashboard – Realtor Project

Dashboard---Realtor-Project

Tasks with people

Tasks-with-people

Voting screen (side menu)

Voting-screen-(side-menu)

Clyp – iPhone Sidebar

clyp---iPhone-Sidebar

Mobile Portfolio

Mobile-Portfolio

DROP CALLING

DROP-CALLING

 

作者:?Iggy

原文地址:http://line25.com/inspiration/mobile-navigation-user-interfaces

譯者:珊子想要去LA

譯文地址:http://www.xueui.cn/appreciate/interface-appreciate/40-unique-mobile-navigation-user-interface.html

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 厲害

    回復
  2. 11

    來自上海 回復
  3. 收藏

    來自本機地址 回復