欧美精品在线一区二区三区_亚洲女同精品视频_日韩一区免费_国产欧美久久久精品免费_国产这里只有精品_僵尸再翻生在线观看_久久99精品国产一区二区三区_亚洲免费一区二区_女教师淫辱の教室蜜臀av软件_中文字幕国产一区二区

超實用干貨!深聊時下最熱門應用的11種設計模式

2015-7-13    高勁

11-popular-design-pattern-1

編者按:今天@十萬個為什麼 同學的譯文討論了當下最熱門的11種設計模式,每種模式都有特別深入的講解以及對應的APP范例,全是多年沉淀下來的通用型設計經驗,絕對是百里挑一的干貨。

任何移動應用,若沒有用戶起初和持續不斷的輸入,就什么也不會發生。因此,移動產品設計師、開發者和產品經理要了解最佳的輸入方式,這點至關重要。盡管移動應用——還有使用它們的用戶——通常都很獨特,但仍有很多通用模式(新舊都有)用來解決這一特殊問題。

用戶輸入設計的6項目標

深入探討這些模式之前,理解用戶輸入設計的6項主要目標非常重要——我把它們列在下面:

  1. 選擇一種適合的輸入和數據錄入方式
  2. 減少輸入的工作量
  3. 設計有吸引力的數據錄入界面
  4. 通過驗證檢查來減少輸入錯誤
  5. 設計必填項說明
  6. 開發有效的輸入控件

模式總覽

記住上面幾項目標,以下設計模式,在本文中都有詳細討論。

  1. 智能鍵盤
  2. 默認值和自動補全
  3. 直接進入(或者說“快速登錄”)
  4. 操作欄
  5. 社交賬號登錄
  6. 大按鈕
  7. 滑動操作
  8. 通知
  9. 隱藏式控件
  10. 擴展式輸入框
  11. 撤銷

1. 智能鍵盤

50fj20150713

Facebook Paper, Android通訊錄

問題

用戶想要快速鍵入信息。

解決方案

用戶點按進入應用某個輸入區塊,在他們鍵入時要提供與數據相關的鍵盤。這樣免去他們在字母與數字鍵盤間切換,不用尋找所需的按鈕,或者多一步操作來激活鍵盤。這不僅為了用戶方便,也可作為一種指示,注明用戶應該輸入什么類型的數據。因此移動平臺的輸入框可以高亮顯示,這增加了靈活性,決定了哪些按鈕應該突出顯示。

例如,在通訊錄或撥號器里輸入手機號碼時,用戶并不需要完整鍵盤。點按這些輸入框時,會彈出數字鍵盤,而非完整鍵盤。去掉了令人分心的不必要的按鈕,流程更加順暢。類似的,點按瀏覽器地址欄,會彈出一個略有改動的鍵盤,“/”和“.com”按鈕就顯示在空格鍵旁邊,而非隱藏于符號內。深入了解系統提供的這些智能鍵盤類型,你的UI可以根據用戶當前的操作而調整。

2. 默認值和自動補全

51fj20150713

Skype, Flightboard

問題

用戶想要快速完成操作。

解決方案

向用戶提供預置的默認值,或者基于之前輸入的數據生成的快速選項。由此預測常用選項,讓用戶更容易進行信息錄入。這可以和實用的自動補全進行搭配,就像Google Play商店的搜索那樣,加快速度,顯著提升用戶體驗。這種模式尤其適用于用戶輸入的標準化,并預知問題的發生。以Skype為例,自動在電話號碼前加上國家碼前綴。這在用戶的角度是有意義的,因為他們通常并不習慣輸入這些信息,但它在這個環境中很重要,因為Skype是個國際呼叫應用。

另一種方式是保存用戶上次輸入的信息,當用戶輸入或搜索時,展現這些最近使用的選項。例如,Flightboard在搜索框下面列出了之前使用過的地理位置,讓用戶免于再次輸入。多數地圖或導航應用也采用了這種模式,搜索方位時自動輸入用戶當前位置,減少用戶點按次數。因為這是最常發生的情況。

3. 直接進入(或者說“快速登錄”)

52fj20150713

Wunderlist

問題

用戶想在做決定前嘗試一下。

解決方案

很多應用允許用戶直接進入,其他什么也不用做——甚至包括注冊或登錄。

記住,用戶同時只能做一件事,他們沒有足夠時間嘗試每個新產品。隨著應用越來越細分化,在培育用戶之前,找到高質量用戶或領袖用戶愈發重要——他們可能會討厭你的產品,或者迅速意識到這不是他們要的。向用戶索要賬號注冊信息比較困難,低的注冊轉化率會與注冊用戶數相互抵消。從積極方面來看,讓用戶直接體驗產品,他們更容易被吸引,這取決于首次體驗時能探索多深。這比引導頁的UI模式更有效,我們會在下次講到那些。因為它直接呈現在用戶面前,而不是告訴用戶如何使用。

推遲注冊對于Carousel或Duolingo這樣的應用就不起作用,它們依賴用戶數據來運轉。但像Wunderlist或Houzz這樣應用可以讓用戶直接進來,在注冊前先使用這個應用。通常,注冊只是增加了額外的好處,使它更具吸引力,比如Wunderlist的跨設備同步,或是在Houzz中創建靈感集。推遲注冊不一定總是好的,不過“注冊前嘗試”是個提升應用吸引力的好辦法。

4. 操作欄

53fj20150713

Facebook Paper, Behance

問題

用戶需要常用操作的快捷入口。

解決方案

在應用的操作欄(用iOS術語叫“toolbar”)提供重要操作的快速入口。盡管導航欄主宰著網頁和早期的移動應用設計,其他一些模式的使用,諸如抽屜菜單、滑動側邊欄、鏈接集合、按鈕變換、垂直的基于內容的導航等,造就了更簡潔的應用界面,讓人關注主要和次要操作項,忽略副導航。這些應用的常用操作,就是搜索、分享和創建新內容。固定菜單不僅讓用戶更加熟悉UI,也去除了雜亂,聚焦于用戶相關的重要操作。

5. 社交賬號登錄

54fj20150713

Beats Music, Flipboard

問題

用戶想要更簡單的注冊和登錄方式

解決方案

整合社交媒體注冊可以讓用戶通過已有賬號登錄。這意味著他們要少操心一組用戶名/密碼,同時你也不必太擔心密碼安全。Facebook、Twitter和Google是最主要的OAuth登錄提供方,你可以依據平臺和目標用戶,整合其中所有或部分到應用中,用戶不必再設置一個未來可能不會用到的獨立賬號。使用這種登錄注冊模式也能為你提供用戶的一些基本數據(他們使用時自動輸入的數據),不強迫他們在剛剛下載的陌生應用中輸入詳細信息,始終保持注冊流程的簡捷。這個簡單的功能可以極大提升用戶體驗,毫無疑問這種模式是眾望所歸。

6. 大按鈕

55fj20150713

Tinder, Shazam

問題

用戶想立刻知道他們該采取哪個操作。

解決方案

理想的觸摸屏點按尺寸可能是72像素,但某些應用比如Tinder,給出了巨大的按鈕。你就清楚知道該怎么做。無論何時、正在做什么,你都能迅速操作——即使你沒有在看,也很難忽略這些大塊的按鈕。這在相對簡單的應用中尤其有價值,其中用戶只有有限的操作,因此就更有理由在各種環境中使它更容易。以Shazam為例,旨在看電視或聽音樂時使用,它確實只有這一個功能。在這種令人分心的多任務狀態下,巨大的按鈕是非常棒的改善。

7. 滑動操作

56fj20150713

Carousel

問題

用戶想關注具體內容。

解決方案

允許內容滑出或移出屏幕。這給用戶提供了非常直觀的信息處理方式。例如Google Now的“卡片”,當你不需要時可以滑動刪除,清除雜亂。類似的,Tinder的個人資料也可以右滑或左滑來表示贊同或否定。這種模式與我們之前在導航模式中討論的滑動視圖不同。此處,滑動操作被當做一種操作,而非純粹瀏覽。有些應用結合了這兩種滑動模式,例如Carousel,滑到一邊可以瀏覽大量照片,同時上滑或下滑操作可以分享或隱藏。Mailbox使左右滑動操作在郵件客戶端中發揚光大,通過相應的左滑和右滑操作,你可以將郵件分別標記為已讀或稍后處理。在Secret中,發現新操作與探索新菜單的方式相同。在一條秘密上左滑表示喜歡。

8. 通知

57fj20150713

LinkedIn, Facebook

問題

用戶想知道新動態或操作,他們要瞄一眼

解決方案

在視覺上通過高亮來標記新內容。這種模式有很多方式。例如,iOS引領的帶數字的小紅點,如今很多其他應用中也能看到,例如LinkedIn、Facebook或Quora。Twitter也這樣處理通知按鈕,不過在時間軸圖標上方也有個小點,用一種更微妙的方式來表示新動態。另一種表現通知的方式,是在應用中滑出一條banner來顯示新動態。Facebook應用也這么做了,當信息流中有新項目時顯示一個小彈出提示。

9. 隱藏式控件

58fj20150713

Secret

問題

用戶要在應用中快速激活次要控件,還有那些只與特定區域或內容相關的控件。

解決方案

清理雜亂,讓用戶只在需要時發現特定操作。這些隱形的控件可以通過各種手勢來觸發——滑動、點按、雙擊、長按等等。(這些我們在手勢模式中討論過)。這讓你可以將這些東西置于屏幕外,節省寶貴的屏幕空間。以Secret為例,就使用手勢代替了可見的控件。右滑觸發操作菜單,這是我們之前提過的抽屜的極簡版。創建內容時,用戶可以水平滑動或在背景上垂直滑動來改變顏色與模式,如果用了圖片,還能改變亮度、飽和度與模糊度。沒有其他控件來控制這些——也不應該有。這種UI設計模式如此直觀和干凈,你一定會看到更多此類交互。Pinterest也使用手勢來代替按鈕的應用。長按圖片會顯示采集或評論按鈕,拖動彈出控件到按鈕上執行。

Uber是這種設計模式的又一個案例。選擇座駕類型后,通過點按滑動按鈕,Uber會在預訂座駕和費用估算間切換。這是簡單卻重要的UI設計模式,我每次試著呼叫座駕,又不想被Uber的溢價剝削時,都會為此會心一笑。Snapchat和Facebook Messenger中,在任何朋友上左滑,都能及時觸發相應功能。

10. 擴展式輸入框

59fj20150713

YouTube

問題

用戶想專注于內容,不愿為了控件犧牲屏幕空間。

解決方案

將控件設計成點按展開式的。這能在用戶不需要時隱藏多數控件。例如YouTube和Facebook把搜索欄藏在一個圖標里面,用戶點按時搜索欄才展開,節省了屏幕空間。

11. 撤銷

60fj20150713

Gmail, Chrome

問題

用戶希望沒有阻礙地快速操作(比如對話框),但要有還原意外操作的選項。

解決方案

提供一個簡便的方法讓用戶撤銷操作,不要在操作前提醒他們確認。有些由于意外或匆忙而產生的操作,會導致不便或數據損失,例如刪除郵件或編輯文字。用戶可能在不知道結果的情況下會完成一項操作,寬容的UI會讓他們嘗試,這更加友好有吸引力。撤銷功能對高級用戶也很有用,他們會贊賞這種操控感。UI不會在操作過程中反復阻攔他們,詢問是否確定。確認對話框用來解釋當前狀況時很有用,但用戶真正看見操作結果后才能理解其中含義。為避免如此,最好去掉它們,并提供一種彌補錯誤的防護措施。

獲取用戶的輸入

追蹤有用戶輸入的地方,看他們是否注意到那些輸入框,是否經常使用輸入控件,他們從應用中的什么界面進入,將要前往哪里(也就是使用流程)等等。持續改變排列、順序、尺寸,調整這些控件,讓用戶更多執行你希望的操作。當然,還要深入考慮,用戶在輸入時是如何在使用你的移動應用——確保設計應用時沒有忽略明顯的要點。

日歷

鏈接

個人資料

藍藍設計的小編 http://m.ocunn.cn

存檔

亚洲精品一区二区二区| 国产精品盗摄一区二区三区| 国产九九精品| 欧美日韩1区2区3区| 成人看的视频| 神马久久一区二区三区| 国产精品调教| 国产劲爆久久| 国产精品一区二区三区四区在线观看| 午夜久久中文| 三级中文字幕在线观看| 黄污视频在线观看| 主播国产精品| 欧美xxxx做受欧美88bbw| 日韩精品毛片| 麻豆传媒视频在线观看| av在线免费观看网| 二区三区在线| freemovies性欧美| jizz视频在线观看| 欧美极品视频| 污污在线观看| 第一福利在线视频| 性欧美18xxxhd| 国产经典一区| www久久久| 亚洲精品一区二区三区中文字幕 | 国产精品原创视频| 福利精品一区| 国内不卡的一区二区三区中文字幕| 婷婷精品久久久久久久久久不卡| 亚洲伦理一区二区| 精品一区视频| 香蕉人人精品| 婷婷丁香综合| 亚洲三级免费| 美日韩一区二区三区| 久久精品国产一区二区三| 国产一区二区在线观看免费| 国产精品99久久久| 99国产精品久| 国产精品九色蝌蚪自拍| 亚洲黄色片在线观看| 一区二区三区欧美亚洲| 欧美日韩综合视频| 精品视频在线免费观看| 精品国精品自拍自在线| 亚洲美女性生活视频| 日韩视频永久免费观看| 18性欧美xxxⅹ性满足| 国产欧美韩国高清| 玛丽玛丽电影原版免费观看1977| 伊人久久大香线蕉综合75| 国产一区二区三区乱码| 亚洲最大成人在线观看| 国产伦精品一区三区精东| 18精品爽国产三级网站| 黄色片视频网站| 999av视频| 韩国中文字幕2020精品| 日韩av官网| 电影91久久久| 日韩电影免费在线观看| 校园激情久久| 成人福利在线看| 亚洲免费在线看| 欧美精品18+| 最近2019中文字幕一页二页| 日本精品久久久久影院| 久久视频在线观看中文字幕| 日韩精品在线视频免费观看| 日本少妇一区二区三区| 欧美丰满熟妇bbbbbb| 国产精品福利电影| 国产一区二区影视| 都市激情亚洲一区| 尤物tv在线精品| 久久国产精品毛片| 国产亚洲欧美中文| 日本国产一区二区| 国产亚洲精品日韩| 日韩av免费在线观看| 日本精品二区| 日韩av卡一卡二| 网站永久看片免费| av网站在线免费看| 欧美成人精品一区二区男人看| 亚洲1234区| 成人在线国产| 精品一区二区免费视频| 日本一二三不卡| 国产精品亚洲第一区在线暖暖韩国| 国产欧美日韩亚州综合| 一本久久综合亚洲鲁鲁五月天| 精品网站999www| 浅井舞香一区二区| 视频一区二区三区在线观看| 亚洲这里只有精品| 日韩影院一区二区| 天天操天天爱天天干| а√在线天堂官网| 香蕉久久精品| 国内精品伊人久久久久影院对白| 亚洲特黄一级片| 精品处破学生在线二十三| 欧美在线欧美在线| 在线观看亚洲视频啊啊啊啊| 国产a√精品区二区三区四区| 日韩网红少妇无码视频香港| 天堂а√在线8种子蜜桃视频 | 婷婷五月综合久久中文字幕| 无码小电影在线观看网站免费| 日韩电影免费在线观看| 成人一区二区三区视频在线观看| 日韩欧美精品网站| 欧美日韩成人在线观看| 日本成人三级电影网站| 国产精久久久久| 亚洲天堂网在线视频| a级网站在线播放| 九九综合九九| 成人免费视频网站在线观看| 欧美日韩国产片| 4438全国成人免费| 免费视频爱爱太爽了| 女性裸体视频网站| 一级在线观看| 4438全国亚洲精品观看视频| 美女mm1313爽爽久久久蜜臀| 欧美日韩精品中文字幕| 欧美另类在线观看| gogogo免费高清日本写真| 97伦伦午夜电影理伦片| 天天干天天色天天| 精品成人18| 久久99在线观看| 91久久精品一区二区三| 日本精品va在线观看| 久久久久久久午夜| 欧美亚韩一区二区三区| 日韩三级影院| 一级毛片免费高清中文字幕久久网| 久久精品人人做| 亚洲精品视频免费| 麻豆av一区二区三区| 国产大学生视频| 少妇无码一区二区三区| 国产日韩一区二区三免费高清| 激情六月婷婷久久| 欧美精品免费视频| 91丨九色丨国产在线| 日韩欧美中文在线视频| 国产高清视频免费观看| 台湾天天综合人成在线| 精品一区二区三区免费观看| 日韩一区和二区| 高清av免费一区中文字幕| 国产成人精品一区二区在线小狼| 国产综合在线播放| 不卡精品视频| 成人激情黄色小说| 精品一区精品二区| 亚洲欧洲精品一区二区| 丝袜 亚洲 另类 欧美 重口| 毛片在线看网站| 欧美福利在线| 欧美午夜宅男影院在线观看| 国产精品手机播放| 亚洲高清av一区二区三区| 乱精品一区字幕二区| 国产精品网址| 国产精品视频一二三区| 久国内精品在线| 久久久久久久久久久久久久国产| 亚洲午夜无码久久久久| 日韩一级特黄| 久久综合中文字幕| 欧美成人免费一级人片100| 免费成人午夜视频| 国产精品亚洲欧美在线播放| 亚洲国产一区二区三区网站| 国产欧美日韩亚州综合 | 日韩一区二区精品在线观看| 国内精品视频在线播放| 肉色超薄丝袜脚交69xx图片| 怡红院av在线| 日韩av二区在线播放| 欧美mv日韩mv亚洲| 中文字幕一区二区三区四区五区| 国产精品黄色网| 国产精品久久久久久久久免费高清| 成人性生交大片免费| 日日狠狠久久偷偷四色综合免费| 欧美亚洲国产成人| 国产美女自慰在线观看| 欧美日日夜夜| 亚洲国产成人porn| 91久久偷偷做嫩草影院| 激情无码人妻又粗又大| yellow在线观看网址| 国产一区二区三区免费观看| xxxxxxxxx欧美| 中文字幕国产传媒| 中文字幕在线资源| 伊人成年综合电影网| 日韩欧美国产一区二区在线播放 | 国产精品久久久久77777| 亚洲精品女人久久久| gogogogo高清视频在线| 久久国产视频网| 日韩在线观看免费高清| 日本中文字幕二区| 国产中文在线| 美女免费视频一区二区| 中文字幕国产精品| 亚洲精品久久久中文字幕| 青青草免费在线| 天堂精品中文字幕在线| 亚洲午夜未删减在线观看| 久久精品香蕉视频| 三级av在线播放| 久久国产免费| 日韩中文字幕久久| 亚洲欧美激情一区二区三区| 日本成人在线播放| 国产伦精品一区二区三区视频青涩 | 亚洲天堂av在线免费| 午夜免费看视频| 三级外国片在线观看视频| 国产一区高清在线| 韩国日本不卡在线| 超碰97av在线| 亚洲aⅴ网站| 欧美日韩亚洲网| 亚洲二区三区四区| 亚洲精品视频网| 亚洲综合精品四区| 久久精品人人做人人爽| 亚洲精品乱码久久久久久不卡| 国产在线精彩视频| 国产精品不卡在线观看| 国产69精品久久久久9999apgf| www毛片com| 国产精品久久观看| 精品调教chinesegay| 国内av一区二区| а√天堂资源官网在线资源| 亚洲图片你懂的| 欧美国产视频在线观看| 国产精品久久久午夜夜伦鲁鲁| 午夜精品网站| 中文字幕少妇一区二区三区| 免费黄色三级网站| 老司机2019福利精品视频导航| 一区二区三区四区五区视频在线观看| 欧美午夜精品久久久久久蜜| 蜜桃视频在线观看www| 视频一区二区国产| 91黄色8090| 久久久久久久中文字幕| 精品国产精品国产偷麻豆| 精品免费日韩av| 男女视频在线观看网站| 理论不卡电影大全神| 亚洲综合免费观看高清完整版在线 | 亚洲第一成人在线| 97在线免费视频观看| 精品资源在线看| 久久久亚洲精品石原莉奈| 国产一区二区在线观看免费播放| 国产成a人亚洲精v品无码 | 国产精品精品久久久| 天天操天天摸天天干| 欧美在线91| 九九热99久久久国产盗摄| 污污视频网站在线免费观看| 色综合www| 日韩精品在线免费| 丰满少妇一区二区| 国产精品中文字幕制服诱惑| 欧美va亚洲va香蕉在线| 白丝校花扒腿让我c| 欧美大片91| 精品免费国产二区三区| 国产a级黄色片| 国产精品15p| 亚洲男人天堂久| 国产精品无码久久久久一区二区| 国产厕拍一区| 日韩av在线导航| 全黄一级裸体片| 一个色免费成人影院| 在线观看91久久久久久| 疯狂撞击丝袜人妻| 国产精品传媒精东影业在线| 国产69精品久久久久9| 国产区在线观看视频| 在线亚洲成人| 国产精品一二区| 婷婷av一区二区三区| 99久久久无码国产精品| 日韩精品不卡| 大片免费在线观看| 黑人精品xxx一区| 久久久久久久久久毛片| 国产美女亚洲精品7777| 亚洲精品久久久久久久久久久| 91精彩刺激对白露脸偷拍| 亚洲欧美成人vr| 免费av一区二区| 久久精品视频7| 蜜臀av性久久久久蜜臀aⅴ流畅| http;//www.99re视频| av在线www| 亚洲男人天堂av| 国产无套粉嫩白浆内谢的出处| 日本免费一区二区三区等视频| 日韩欧美国产系列| 内射毛片内射国产夫妻| 欧美理论在线| 国产在线视频91| 亚洲做受高潮| 一区二区三区日韩欧美精品| 亚洲高清免费在线观看| 日韩欧美一级| 久久精品精品电影网| 久久久久久亚洲av无码专区| 国产精品主播直播| 亚洲一二三区精品| 国产免费拔擦拔擦8x高清在线人| 69精品人人人人| 人人艹在线视频| 麻豆成人精品| 久久资源亚洲| 国产第一页在线| 欧美v日韩v国产v| 久草免费新视频| 精品一区二区三区在线观看国产 | 国产成人综合精品| 婷婷在线免费观看| 亚洲免费在线视频一区 二区| 激情久久综合网| 激情五月综合| 国产免费一区二区三区在线观看| 在线观看国产福利视频| 精品国产户外野外| 国产精品成人一区二区三区电影毛片| 中文字幕乱码亚洲无线精品一区| 国产精品直播网红| 黄视频在线播放| 欧美三级欧美一级| 欧美一级片在线视频| 日韩电影在线一区二区三区| 水蜜桃一区二区三区| 自拍偷自拍亚洲精品被多人伦好爽| 亚洲欧美日韩第一区| 91麻豆精品在线| 国产日产精品一区| 色婷婷激情视频| 中文字幕一区二区三区欧美日韩| 91精品国产综合久久久久久丝袜| 黄色在线免费| 欧美精品一区二区在线播放| 成人在线免费看视频| 97久久超碰国产精品电影| 天天碰免费视频| 97精品在线| 激情小说综合网| 小草在线视频免费播放| 一本久久综合亚洲鲁鲁| 国产浮力第一页| 性感美女极品91精品| 永久免费看mv网站入口78| 男人的天堂久久精品| 日本道在线视频| 男人的天堂久久| 91精品久久久久久久久久久久久| 黄色小网站在线观看| 亚洲高清不卡av| 国产又大又黄的视频| 玉米视频成人免费看| 中文字幕第4页| 国产一区在线观看麻豆| 日韩av在线第一页| 成人3d精品动漫精品一二三| 福利视频一区二区三区| 日韩三级影视| 97碰碰碰免费色视频| 久久久资源网| 亚洲精品xxx| 精品美女www爽爽爽视频| 精品免费在线视频| 超碰在线国产97| 久久久影视传媒| 国产中文字幕一区二区| 麻豆91在线播放| 国产一二三区av| 国产精品一级| 黄色国产精品视频| 中文字幕乱码亚洲无线精品一区 |