原型設計應當掌握的四個設計思維:初始、常態、邊界、錯誤
從產品助理到產品經理,從負責模組優化到從0到1的全程設計、跟蹤,從完全的產品小白到擁有自己的設計方法,這是一個成長的過程艱辛又坎坷。現在將要分享的是成長中所學到的一小段小知識:原型設計應當掌握的四個設計思維。
原型設計應當掌握的四個設計思維包括:初始、常態、邊界、錯誤。這四種方法,產品經理在設計中可能有的人都經常在這樣做,但是少有人總結提煉出簡單八個字所深諳的設計思路。當你看到這篇文章的時候,或許應該開啟腦洞回憶下在原型設計的時候你是否也都考慮到了,考慮到了初始、常態、邊界、錯誤的四種情況,當時的你是怎麼想的,設計出來的原型在評審的時候是否漏洞百出?如果有那麼正好,這篇文章可以幫你彌補一些你欠缺的思路,我沒有卓越的產品設計經驗,只是想把自己學到的和感悟到的分享給你,何不泡杯咖啡一起討論下呢?
初始
初始,簡單理解就是,你要展示給別人的第一印象。如果想象下,我不那麼認真的打扮自己,頭髮像一個鳥窩,一身邋遢樣,我感覺,見面沒多久她會說我下午還有事先走了,下次有機會再約非常抱歉之類的話。說這麼多,只是想告訴你,第一印象多麼重要,在最簡短的時間裡抓住使用者的心理讓她們對你(的產品)產生好的印象。
如何建立使用者的第一印象?這就是我下面要說的產品設計四個思路的第一個:初始。初始分為介面結構、樣式和功能,使用者進入APP,第一眼就能看見,有沒有我想要的(介面結構清晰簡單),是不是我喜歡的(介面樣式是否喜歡或則至少不會醜到不能直視)。
介面結構,使用者進來首頁,看完大致內容,想要進一步操作,是不是簡單容易最好是不用思考,導航的設計,資訊結構的建設,這些都是初始化設計要做的事情。
介面樣式,這包含了排版、佈局、文字大小、顏色,做產品設計的時候不求像UI設計師那樣專業,但是至少應該略懂。
功能的初始,APP啟動需要哪些配置,後臺如何設計;在進入無資料頁面,如何提醒使用者,並指導他們進行後面的操作。
常態
原型設計的第二個思維,常態。常態怎麼理解?APP或則網頁正常執行的介面,常態是我們最不容易忽視的地方,頁面的展示、排版、佈局都是常態設計。做常態設計的時候,首先我們要明白設計的目標,這個頁面需要承載的功能,如果存在多角色(如領導、員工)還要考慮領導進入頁面和員工進入頁面所展示的內容的差異。
常態涉及的內容比較寬泛,這裡舉個簡單的例子,關注微信(XXXX),以後單獨寫幾篇關於常態的設計思路。(問號表示還需考慮,這是簡單的原型,不過設計出來後,自己挺喜歡的。)
邊界
原型設計的第三個思維,邊界。邊界包含了操作邊界和顯示邊界、戰略邊界
何為操作邊界?這裡轉載一篇評論:作為一名產品/開發,邏輯思維和邊界意識一定要OK,你至少需要說明你的場景是左手還是右手,使用者中單左手操作、單右手操作、左手持機右手操作、右手持機左手操作這些分類的人群比例有資料或做過調研?如果不清楚比例,那你的思考一開始就有失偏頗了。(出自 xiaoyuanjackhttp://www.woshipm.com/pd/93386.html)
還有一種邊界叫顯示邊界,比如使用者在執行操作時手指的接觸面是無法看到手指下面的內容的,所以對於某些尺寸很小的互動元素(如按鈕),需要將實際的可觸擊區域擴大到其可視範圍;又如,簡書的暱稱輸入,最長可以輸入漢字呢?文章標題長度超出顯示的邊界,點選數隨著日積月累變得很長,這些需要產品經理在設計的時候就要思考。
戰略邊界,確定哪些是我們產品要做的,哪些是堅決不碰的(瘋狂番茄/滴答清單,最簡單的工具,AppStore),哪些目前階段觸控但是不深入做的,戰略邊界需要更有經驗的高階產品經理或者產品總監、老闆來確定,或許你現在可以慢慢培養這樣的思維。說句題外話,總監單獨給我開小灶的時候,提了一句我想我永遠不會忘記的話:心中有格局,眼裡有畫素。
錯誤
最後一個方案,錯誤。網頁和APP,在不同人操作或則不同環境下操作,可能會出現一些異常情況。比如網路不好,程式出錯,無權訪問等等。猜猜下面這張圖是哪一個APP的友善提示呢?
小結:
無論是設計APP還是網頁,又或是其中一個模組,在設計的時候,我們都要先考慮初始化,當使用者進入頁面看到的主要內容有哪些,有哪些功能的入口;然後開始著手原型,注意保持邊界思維,顯示內容的長度,需要點選按鈕的大小等等;如果網路訊號不好、或則頁面不存在的時候需要有載入提示或則錯誤提示,不要讓使用者覺得APP/網站伺服器不好、程式太爛,產生不好的印象。最後想說的是,這四個思維非常有用,消滅了大部分設計的細節,更多互動細節,以後隨著學習和實踐的深入再和大家一起交流。
作者:劉洋,微信:pmliuyang,座標成都,細心的你知道我是做什麼型別的產品,歡迎加我。
相關文章
- PCB原理圖設計常見錯誤
- 請問各位程式設計師,是我的思維方式有錯誤嗎?程式設計師
- MySQL 那些常見的錯誤設計規範MySql
- 更好的前端設計形式——設計者犯的常見錯誤及修改方法前端
- 程式設計師思維程式設計師
- React 錯誤邊界元件React元件
- 將設計思維應用於人工智慧人工智慧
- 抽取思維(重構設計)
- 設計思維思考——遊戲中的幸福感設計遊戲
- 當然不是草臺班子 雲譯網 原型設計+概要設計原型
- 跳出程式設計師思維:如何應對上手英文工具站的幾點誤區程式設計師
- 錯誤碼設計思考
- 原型設計原型
- 牛逼程式設計師必須要掌握金字塔思維程式設計師
- 2021年網站設計中的四個誤區網站
- Java設計模式之(四)——原型模式Java設計模式原型
- UI設計培訓分享:ui設計師如何培養設計思維?UI
- 大型系統應用邊界設計原則與實踐
- React 高階應用 -- 錯誤邊界 Error BoundariesReactError
- 突破設計邊界,盡在AutoCAD2020!
- Flink的狀態程式設計和容錯機制(四)程式設計
- 教你避雷!網頁設計中常見的17個UI設計錯誤集錦(附贈設計技巧)網頁UI
- Python程式設計常見十大錯誤,搞事情!Python程式設計
- 原型設計中的產品原型原型
- 原型設計工具原型
- 【設計模式(四)】建立型模式--原型模式設計模式原型
- 原型設計工具個人部落格原型
- 一天一個設計模式(四) - 原型模式(Prototype)設計模式原型
- 一天一個設計模式(四) – 原型模式(Prototype)設計模式原型
- API的設計(1) - 錯誤處理API
- React元件設計之邊界劃分原則React元件
- 戲說領域驅動設計(八)——邊界
- 如何比設計更懂設計-做好前端錯誤提示前端
- 從概設流程、審美、設計思路幾個方面,漫談遊戲美術設計的思維方式遊戲
- 原型設計工具的分析原型
- 跨界造物:有趣!遊戲關卡設計中的建築學思維與方法遊戲
- 程式設計師旅程中的思維與精神程式設計師
- 產品設計中的地圖學思維地圖
- 用程式設計師的思維瞭解Filecoin程式設計師