如今此蜈，隨著移動端APP的功能越來越豐富堰氓，一些專門針對安全性問題的軟件應(yīng)用也不斷涌現(xiàn)适荣。今天，我們就一起來看看：一款安全停車App（Pazi）是如何一步步設(shè)計而成院领，并了解和學(xué)習(xí)其背后的UX&UI設(shè)計經(jīng)驗和技巧弛矛。
文章將從設(shè)計理念、用戶場景比然、UX線框圖以及UI設(shè)計等方面進行展開丈氓。希望對大家有所幫助。
項目設(shè)計背景
現(xiàn)今强法，世界各地万俗、數(shù)以萬計的汽車司機都被相似的問題困擾著：車輛不時被他人蓄意破壞、車輛停放期間意外損壞以及不了解停放點安全性等問題饮怯。如此闰歪，車輛駕駛?cè)藛T們急需一個統(tǒng)一的在線停車社區(qū)，幫助他們及時獲取和交換各自的交通事故和安全停車點信息蓖墅。而Pazi就在這樣的情況下應(yīng)運而生课竣。
它擁有非常廣泛的目標(biāo)受眾，只要擁有車輛和相關(guān)牌照置媳， 即可注冊登錄使用于樟， 不受年齡、性別拇囊、身體情況以及文化素質(zhì)方面的限制迂曲。
此外， 值得注意的是：由于其受眾的廣泛性寥袭，用戶使用過程中所涉及的設(shè)備類型豐富多樣路捧，所處場景也是復(fù)雜多變肺蔚。 例如光線情況持际、噪音情況以及其它相關(guān)因素都極大影響著用戶體驗。這必然要求設(shè)計師在設(shè)計過程中吩屹，盡量保持界面直觀易用膘掰，并符合大眾使用習(xí)慣章姓， 以提供更加愉悅的用戶體驗。
而為實現(xiàn)這一點识埋，設(shè)計師在App設(shè)計過程中主要考慮到了以下三個用戶場景：
用戶場景分析
場景一：目擊者報告事故
當(dāng)用戶目擊事故時凡伊，通過該軟件，可輕松填寫并上報事故詳情窒舟。例如寫明事故原由（汽車爆胎系忙、輪胎側(cè)滑 、誤用散光燈）以及停車罰單等信息惠豺。尤其是银还，當(dāng)用戶填寫完相關(guān)涉事車輛牌號后风宁，涉事車輛車主能夠立即收到通知，并及時作出應(yīng)對蛹疯。
場景二：司機實時了解和追蹤車輛情況
當(dāng)用戶停好車后杀糯，通過該軟件，亦可實時了解和追蹤車輛情況苍苞。而且，啟用停車模式之后狼纬， 亦可實時獲取附近車輛和停車點的相關(guān)情況羹呵。比如，當(dāng)臨近汽車發(fā)生事故（例如車頂受損）或附近路段發(fā)生嚴重交通事故時疗琉，用戶會在第一時間收到通知冈欢，及時行動，查找更安全的停車點盈简，從而確保其車輛財產(chǎn)安全凑耻。
場景三：協(xié)助警察處理各種交通事故
該軟件應(yīng)用亦可協(xié)助警察搜尋事故目擊者， 解決各類交通事故柠贤。比如香浩，當(dāng)車輛因為電池沒電，無法打開車燈并造成交通事故時臼勉，使用該功能邻吭，就不至于出現(xiàn)被控故意損毀他人車輛的情況。如此宴霸，各司機用戶就可輕松避免很多不必要的麻煩囱晴。
總之，從這方面來講瓢谢，Pazi應(yīng)該是一款能供廣大司機用戶在線聚集畸写，實時交換交通信息，減少車禍氓扛，并及時針對車禍做出應(yīng)對的工具枯芬。
用戶體驗設(shè)計
下面我們再一起看看：設(shè)計師是如何通過各個界面和導(dǎo)航設(shè)計，輕松實現(xiàn)以上提及的用戶場景和用戶需求：
主頁設(shè)計
軟件主頁地圖設(shè)計采郎，不僅能夠幫助用戶輕松追蹤車輛最新事故破停，還能引導(dǎo)他們快速查找并使用各項功能。
搜索框：供用戶及時搜尋安全停車點尉剩，并實時查看所在區(qū)域內(nèi)的所有事故情況真慢。
選項卡設(shè)計：確保用戶能夠在個人頁面和事故頁面之間快速切換。
添加按鈕：允許用戶輕松添加和填寫任何事故報告理茎。
功能模塊：確保用戶即使遠離停車點黑界，也能實時追蹤車輛以及周圍事故情況管嬉。
事故頁面設(shè)計
該頁面采用了選項卡設(shè)計，并添加了兩個選項標(biāo)簽：
事故標(biāo)簽：直觀展示當(dāng)前城市內(nèi)所有已添加的事故報告朗鸠。
通知標(biāo)簽：一旦任何事故報告中涉及用戶車輛牌號時蚯撩，用戶能夠立即收到通知， 并及時處理相關(guān)事故烛占。
用戶流設(shè)計
一般而言胎挎，UX線框圖設(shè)計階段，設(shè)計師需要清晰展現(xiàn)軟件界面布局忆家、導(dǎo)航以及交互流程等相關(guān)信息犹菇。
而設(shè)計師在此階段結(jié)合上面提及的三個用戶場景之后，做出了以下設(shè)計：
場景一
為方便目擊者用戶快速添加事故報告芽卿，軟件主頁添加了直觀易用的CTA按鈕揭芍。用戶點擊按鈕，即可展開事故頁面卸例，選擇所需事故類型称杨。在彈出全新的事故詳情頁面之后，即可按需填寫事故相關(guān)信息筷转。而事故發(fā)生地址也會根據(jù)用戶所在地自動獲取姑原。當(dāng)然，當(dāng)用戶事故申報有所延遲時呜舒，亦可手動修改事故地址页衙， 確保信息的準(zhǔn)確性。
而且阴绢，該頁面中涉事車輛牌號被設(shè)置為必填項目店乐，以便軟件能夠及時通知涉事車主，了解事故詳情呻袭。其事故說明字段設(shè)計眨八，亦能幫助用戶提供更多的事故細節(jié)。但考慮到類似說明字段會一定程度上影響事故填寫和申報速度左电，該字段并非必填項目廉侧。用戶可根據(jù)需要選擇填寫或不填寫，以優(yōu)化用戶體驗篓足。
此外段誊，為滿足用戶添加事故證明資料（例如照片和短視頻等）方面的需求，設(shè)計師還有意添加了相機功能設(shè)計栈拖。用戶點擊相機按鈕连舍，即可快速上傳手機相冊內(nèi)的最新照片。長按亦可快速錄制并上傳短視頻涩哟。 操作簡單易用索赏。
最后盼玄，為確保用戶能夠直接聯(lián)系事故目擊者，同時又不造成任何個人信息泄露等安全問題潜腻，設(shè)計師為該功能添加了復(fù)選框設(shè)計埃儿。 用戶可根據(jù)具體情況，自由選擇是否公開聯(lián)系信息融涣。 此外童番，該功能也僅僅只有車輛所有者才有權(quán)限進行設(shè)置， 以進一步確保個人信息的安全性威鹿。
場景二
司機停好車輛之后剃斧，可通過軟件標(biāo)記對應(yīng)地點。開啟停車模式之后专普，軟件也會自動記住該地點，并實時監(jiān)控車輛附件區(qū)域情況弹沽。如此檀夹，當(dāng)任何事故報告涉及該車輛或附件區(qū)域出現(xiàn)交通事故時，軟件會自動通知該司機策橘，及時處理和應(yīng)對相關(guān)事故炸渡。
場景三
當(dāng)用戶急需去往其它地方停車時，亦可簡單使用其界面搜索框丽已，搜尋附近安全停車點蚌堵。并通過查看停車點最近事故發(fā)生情況，決定是否選擇該停車點停車沛婴。
此外吼畏，在UX線框設(shè)計過程中，如若對類似用戶場景的設(shè)計效果不太確定時嘁灯， 設(shè)計師可簡單選用一款高效易用的原型工具（例如更快泻蚊、更簡單的Mockplus原型工具）, 將設(shè)計想法輕松轉(zhuǎn)化成可點擊分享的原型。然后丑婿，再逐一測試性雄，并收集反饋，以確保設(shè)計想法的可行性羹奉。
界面設(shè)計
界面配色和風(fēng)格設(shè)計
整款A(yù)pp選用了更能突出界面內(nèi)容秒旋、提升界面可讀性的淺色系配色。而且诀拭，應(yīng)用戶希望以青綠色為主的配色需求迁筛，設(shè)計師最終選擇了如下圖的軟件配色。 旨在通過色彩視覺元素耕挨， 打造更加友好易用的界面設(shè)計和舒適優(yōu)雅的設(shè)計風(fēng)格瑰煎，以提升用戶體驗铺然。 此外，這樣的簡約的設(shè)計風(fēng)格酒甸，對于減少界面噪音魄健，也是極實用。
事故分類圖標(biāo)設(shè)計
為統(tǒng)一設(shè)計風(fēng)格插勤，設(shè)計師還為每個事故分類添加了特有的圖標(biāo)設(shè)計沽瘦，并選用了不同顏色，以便用戶能夠在不同頁面快速識別和應(yīng)用相關(guān)功能农尖。畢竟析恋，顏色標(biāo)記是公認的降低用戶記憶負擔(dān)， 并加速頁面交互設(shè)計的有效方式盛卡。如此助隧，用戶在閱讀事故詳情之前，就能輕松了解事故相關(guān)內(nèi)容滑沧。
相機功能設(shè)計
其簡單方便的相機功能頁面設(shè)計并村，也輕松滿足了用戶對停車類App的核心需求：快速拍照或錄制短視頻。極簡的布局和導(dǎo)航滓技，直觀易用哩牍。用戶點入，即可快速拍攝事故照片并上傳令漂。
最后膝昆，我們在一起來看看軟件App的其它界面設(shè)計：登錄/注冊頁面設(shè)計、地圖交互設(shè)計叠必、個人頁面設(shè)計荚孵、用戶聯(lián)系界面設(shè)計等。
結(jié)語：
總之纬朝，無論哪種類型的手機端App处窥， 設(shè)計師都需緊緊圍繞頁面簡潔、直觀以及可讀性方面進行構(gòu)建玄组，以提供更加愉悅滔驾、積極的用戶體驗。
希望以上的手機停車App案例分享能對大家有所幫助俄讹。
