make-a-prototype-in-3-days-1

編者按:原型是APP后續的視覺設計與開發的重要基礎,原型的構建幾乎決定了產品的走向,失之毫厘,謬以千里。在很多時候,原型設計的時間有限,如何快速制作準確可靠的原型就是產品和設計師要操心的事情了。今天的文章用一個天氣類應用作為案例,詳細講述了如何圍繞用戶體驗在三天內搞定原型設計,希望能給你幫助~

基本流程

第一天:研究&總結
第二天:構想&設計
第三天:測試&迭代

工具:筆、紙、iPhone、POP(Beta,免費版)

研究

用戶訪談

在同潛在用戶溝通之前,我會事先準備好三個問題:“你為何會查看天氣?”“你現在在用哪些天氣類的網站和APP?”“你會多久查看一次天氣?”

準備好問題之后,我花費了一天時間,同六個用戶圍繞這3個問題進行訪談。

·用戶——用戶群體可以被劃分為兩個大類
·背景——兩者都會在早上查看天氣,這是他們交叉天氣查看時間
·行為——查看天氣是每天早上的日常行為,并且會圍繞著天氣做一天的準備;其次,這種行為很明顯是為了更好地圍繞著天氣情況計劃周末和旅行之類的活動。

在研究分析的時候確定兩類用戶群

用戶訪談繼續

為了發現更多關于用戶需求和用戶目標的細節問題,我需要繼續六人訪談,并且借助我的“四列表”方法來搞定這一切。這種方法并不難,我會在訪談階段將時間劃分為連續的四個塊,這四塊時間內,這6名用戶需要針對四個不同的主題,盡可能多的列出他們的想法。這四個主題是這樣劃分的:

·痛點——在查看天氣時哪些事情會讓人感到沮喪或者糾結?
·樂趣——哪些設計體驗良好,它們有沒有提升空間?當一切運轉良好的時候,應該是什么樣子?
·背景——什么時候、什么地方你會查看天氣?
·行為——當你查看天氣的時候會怎么做/操作,會有什么樣的感受?

總結

將數據轉化為想法

通過用戶訪談,我將用戶的數據搜集起來,確定那些讓用戶愉悅或者痛苦的地方,從而辨別出那些同用戶緊密相連且能引起共鳴的設計。

根據用戶訪談之后的分析總結,完善關于用戶目標的初步想法

確定功能

問題:用戶快速獲取相關天氣信息基本會圍繞下面三種模式:1)為新的一天做準備;2)查看當時的天氣情況;3)為后續的事件做準備。

1、早上用戶首要的事情是查看天氣,確定當天要穿什么帶什么→主屏幕應該在顯著位置未來一個小時內的溫度和降水等情形。
2、為了做好準備,用戶需要整天的精準數據 → 第二屏需要包含以小時為單位的精準數據。
3、有一部分用戶需要知道是否需要攜帶抗過敏藥物 → 需要顯示當天空氣中的花粉濃度,以及未來三天甚至一周的拓展數據。
4、用戶可能會碰到突變的天氣,諸如陣雨和冰雹 → 在天氣惡劣或者突變的情況下對用戶即時發出通知
5、用戶需要為周末或者旅行進行計劃則需要至少未來3~5天的視圖 → 需要為用戶準備可以延長時間段的模塊
6、用戶喜歡能快速訪問多個地點的信息→ 需要讓用戶可以添加額外的地點,并且可以通過快速滑動或者下拉來訪問
7、喜歡騎車或者經常四處溜達的用戶需要知道相關時段兩點之間的路況 → 需要添加一個支持A點到B點路況信息的模塊
8、有用戶講述了他曾在旅程中遭遇奇怪惡劣天氣但天氣APP并未提醒的事情 → 需要考慮為應用增加一個模塊,專門為用戶提醒當前地區日常情況和應對技巧
9、做好了周末出行計劃但又錯過了好天氣是一個共同的痛點,想在好天氣享受出行樂趣是共同的需求 → 考慮增加一個快速查看下一個周末天氣的模塊

設計

為什么要手繪?

根據我的發現,最初的概念設計主要是借助筆和紙完成的。手繪設計的特色就是速度快。相同時間之內,提交一份電子文檔的時間足夠我在紙上畫十個原型了。

第一版原型

借助一個名為POP(Prototyping on Paper)且尚處于測試階段的APP,我能夠將我的手繪原型轉化為界面。接下來,我要開始做測試了。

測試第一輪

我為前來測試的志愿者提供了兩種情形,我為他們準備了iPhone版的POP原型,并且觀察他們執行任務的行為和反應。

情形1:“想象你剛剛醒來,你打算開始新的一天,并且想知道當天天氣如何,能展示一下你將如何操作么?”

情形2:“想象一下,你準備在周末參加戶外音樂會,但是不知道天氣如何,你會怎么辦?”

結果與迭代

·用戶需要進行一些必要的滾動和點擊操作,才能到達相關的界面,之后用戶會根據顯示的數據進行思考并作出相應的決策。
·在觀察第一輪測試過程中,我逐漸意識到我錯過了一個關鍵點:天氣是影響我們享受生活的因素。

“我們要如何充分利用好天氣來享受生活,并且盡量讓惡劣的天氣負面影響更???”

測試有助于重構用戶目標

語音界面

我開始意識到,我上一版的設計在問題的關注點上就偏移了,它僅僅只是代表了我和測試者的共同需求。

用戶目標本質上是作出明確的決策,最終的目的是搞明白要穿什么、帶什么、準備什么以及是否要繼續某個特定活動。

而第一版的原型一開始先設定好交互和操作的方式,并未抓住問題的核心。所以,我準備在第二版原型上圍繞著用戶的核心目標,來調整設計。

第二版原型

這個概念姑且稱之為“Little Birdy”,它加入了一個更加直接的語音操作界面,在你剛剛進入程序的時候需要稍加設置個人信息和喜好,在這個流程中,程序會對你了解更多。

這種新的設計,移除了復雜的滾動和點擊操作,用戶也無需分析復雜數據來做決策,程序會替你給出合理的建議。不過這樣的設計,APP需要搜集相當的數據,來確保用戶得到正確的結果。

測試第二輪

我們為測試者再次提供了兩種新的情形,并且為他們安排了新的任務,并要求對APP進行定制化。初步反饋信息非常理想。

下一步

如果有機會進一步完善這一原型,接下來要做的重要步驟包括如下內容:

·額外的用戶研究和測試
·改進UI設計:怎樣設計可以讓界面更簡單?
·優先增加的功能,諸如惡劣天氣通知
·增加用戶引導教程
·測試跳過介紹的選項
·探索付費功能的可能性

我還注意到,這個項目是圍繞著用戶體驗來進行設計的,并未考慮到市場的需求,也就是說,如果要實施起來還應該加入市場競爭分析。

挑戰與收獲

從用戶體驗的角度來看這個項目,設定明確的目標對于高效研究和用戶數據搜集有著極其重要的意義(同樣的,這也對于大規模數據分析有著重要意義,比如人口統計數據在類似APP中的具體應用)。

由于只有三天時間來創建整個原型,時間資源極其有限,所以設定好各個環節的時間間隔,對于后續的工作很有幫助。這也是為什么手繪原型是整個環節最重要的手段。

當你在蘋果的App Store中搜索天氣應用的時候,超過8000個同類應用證明這類工具的廣泛存在,而這也是這款帶有我個人烙印的應用脫穎而出的主要障礙。

這次項目之后,我意識到了做記錄(包括設計注釋、用戶訪談的內容記錄、設計過程中的記錄)是一項關鍵的技能,我打算通過保持每天做記錄的習慣來提升這一技能,這可以為后續的設計決策節省大量的時間。

【APP設計那些事兒】

學習優秀案例:
《洗腦推薦!有哪些色彩豐富的極簡APP設計?》

掌握專業工具:
《歪果設計師真會玩!13款設計師標配的實用APP》

提升產品氣質:
《小處顯逼格!APP界面如何在細節上提升氣質?》

原文地址:medium
優設譯者:@陳子木

「子木說」

Axure在原型設計工具領域的地位就像PS之于設計師,它最大的特色就是每個產品經理都在用它。說不上為什么,一直對它喜歡不起來。在Mac平臺上推薦一個更原生、有口皆碑的原型設計工具,OmniGraffle。網上相關的介紹文章并不少,稍加搜索能找到不少。下載戳這里:OmniGraffle,注冊機。

本文由優設網原創翻譯,請尊重版權和譯者成果,轉摘請附上優設鏈接,違者必究。謝謝各位編輯同仁配合。

【優設網 原創文章 投稿郵箱:2650232288@qq.com】

================關于優設網================
“優設網uisdc.com“是國內人氣最高的網頁設計師學習平臺,專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書:史上最全的設計師圖書導航:http://hao.uisdc.com/book/。
設計微博:擁有粉絲量97萬的人氣微博@優秀網頁設計 ,歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航:全球頂尖設計網站推薦,設計師必備導航:http://hao.uisdc.com
———————————————————–
想在手機上、被窩里獲取設計教程、經驗分享和各種意想不到的”福利”嗎?
添加 優秀網頁設計 微信號:【youshege】優設哥的全拼
您也可以通過掃描下方二維碼快速添加:

sdcweixin

點贊
收藏

發表評論 快來秀出你的觀點

還可以輸入 800 個字
 
 
載入中....
相關推薦
評論 收藏