htmlcss流程圖(h5流程圖)
一、設(shè)計(jì)流程介紹:
由于公司還處在一個(gè)創(chuàng)業(yè)的階段,對于設(shè)計(jì)流程的設(shè)計(jì)更傾向于簡單高效;主要流程包含:需求收集、需求列表、需求設(shè)計(jì)、需求開發(fā)及最后的需求驗(yàn)收;迭代周期為兩周一個(gè)版本,整體的節(jié)奏還是比較快的,再整個(gè)需求執(zhí)行過程中也是采用一個(gè)瀑布加任務(wù)并行的方式進(jìn)行設(shè)計(jì)方案的推進(jìn),只有這樣才能按照迭代周期穩(wěn)步前進(jìn),下圖為我們處理需求的整個(gè)流程:
二、需求收集篩選:
1、需求收集:
就需求收集的重要性我就不多講了,不管是做產(chǎn)品或者交互都要收集各種需求,來確定產(chǎn)品迭代的方向;所處的公司或者團(tuán)隊(duì)不同,收集需求的方式也不近相同;我們收集需求的方式主要有以下幾種,其中最主要的方式還是通過數(shù)據(jù)收集和用戶反饋:
(1)高層決策:也叫老板需求,主要來自于公司高層的戰(zhàn)略決策;需求方包括CEO及各個(gè)部門的主要負(fù)責(zé)人;這個(gè)不多做解釋,大家都懂;
(2)數(shù)據(jù)收集:通過APP內(nèi)的數(shù)據(jù)打點(diǎn)以及借助數(shù)據(jù)分析平臺(tái)來分析用戶行為,得出具體的優(yōu)化點(diǎn)或者突圍點(diǎn)。對于數(shù)據(jù)收集,它是一種有效及靠譜的方式,但是對于中小型團(tuán)隊(duì)來講,去做大亮的用戶調(diào)研及原始數(shù)據(jù)積累是一件很難的事情,時(shí)間和財(cái)力成本都很高;所以適當(dāng)?shù)慕柚谌綌?shù)據(jù)分析平臺(tái)是個(gè)很好的選擇,準(zhǔn)確又高效;
展開全文
(3)用戶反饋:用戶反饋其實(shí)是一個(gè)很重要的需求收集入口,包括應(yīng)用市場評(píng)論、APP端意見反饋及核心用戶私聊等方式;
(4)種子用戶群:對于一個(gè)有著一定用戶群體的產(chǎn)品來講,種子用戶群的建立是必須的;我主要是通過建立QQ群的方式,來集中收集用戶的反饋及意見;
2、需求篩選評(píng)估:
通過以上方式將需求收集之后,接下來會(huì)對這些需求進(jìn)行篩選確認(rèn),過濾掉一些偽需求;我對于需求篩選的維度包含這么五個(gè),包括:業(yè)務(wù)目標(biāo)、性價(jià)比、重要度、影響用戶數(shù)及真是與否。需求篩選之后,會(huì)將最終的需求放置在需求池中,一般需求池中存放四個(gè)版本迭代的需求,這樣就不會(huì)在產(chǎn)品迭代過程因?yàn)樾枨蟛淮_定而手忙腳亂。
(1)業(yè)務(wù)目標(biāo):對于公司來講業(yè)務(wù)目標(biāo)永遠(yuǎn)是最要的,尤其是創(chuàng)業(yè)公司;當(dāng)然要在用戶第一的基礎(chǔ)之上了;
(2)性價(jià)比:做一個(gè)需求再公司內(nèi)部還是要考慮自身承受的極限的,要考慮時(shí)間、技術(shù)、人力及推廣成本等等,盡量做到以最少的資源消耗達(dá)到自身產(chǎn)品的目的;
(3)重要度:一方面要考慮公司的業(yè)務(wù)目標(biāo),另外也要考慮用戶的需求;至于那個(gè)最重要要視具體情況而定;
(4)影響用戶數(shù):這個(gè)維度對于有很大用戶量的產(chǎn)品來講,是很重要的一點(diǎn),盡量避免影響的用戶的范圍擴(kuò)大;
(5)真實(shí)與否: 有時(shí)候我們通過用戶反饋或者其他得到的需求不一定都是真實(shí)的,還是需要二次的評(píng)估;
三、需求設(shè)計(jì)評(píng)估:
需求評(píng)估結(jié)束之后,就進(jìn)入到了需求設(shè)計(jì)階段;在這個(gè)階段要完成產(chǎn)品方案的設(shè)計(jì),最終產(chǎn)出高保真原型圖及需求文檔。
1、參與者及產(chǎn)出:
(1)產(chǎn)品經(jīng)理:產(chǎn)品要輸出產(chǎn)品流程圖或者簡單的頁面結(jié)構(gòu)圖;
(2)交互設(shè)計(jì)師:交互要根據(jù)產(chǎn)品提供的流程圖或者簡單的頁面結(jié)構(gòu)圖,梳理出產(chǎn)品的信息架構(gòu)以及根據(jù)需要產(chǎn)出具體的交互動(dòng)效;
(3)UI設(shè)計(jì)師:UI根據(jù)交互原型輸出最終的視覺稿,也就是用戶最終看到的界面;待設(shè)計(jì)稿評(píng)估完成之后,設(shè)計(jì)師根據(jù)要求將界面切圖標(biāo)注;
2、交互文檔細(xì)節(jié):
為了使開發(fā)人員能方便的開發(fā),我們將產(chǎn)品、交互及視覺文檔整合在一起輸出;所以文檔為高保真原型加產(chǎn)品及交互邏輯的集合,這樣我們的技術(shù)人員只需看一個(gè)文檔就可以了,能有效的節(jié)省溝通成本,提高開發(fā)的效率。對于交互文檔,一定要細(xì)致將各種邏輯細(xì)節(jié)表述清楚,其中包含以下幾個(gè)方面:
(1)頁面布局:頂部標(biāo)簽欄、中部內(nèi)容區(qū)及底部操作欄的功能釋義,操作路徑、顯示樣式等;
(2)手勢及轉(zhuǎn)場:操作功能或者界面用到的手勢有哪些,例如左滑、右滑、上滑、下滑等;還有轉(zhuǎn)場細(xì)節(jié),比如左移入、右移入、上移入、下移入等;
(3)反饋效果:輸入反饋、點(diǎn)擊反饋、彈窗邏輯、錯(cuò)誤反饋、刷新等;
頁面跳轉(zhuǎn):也就是轉(zhuǎn)場邏輯;
(4)元素的規(guī)則定義:關(guān)鍵功能、關(guān)鍵信息等;
(5)其它細(xì)節(jié):缺省頁面、成功/失敗狀態(tài)、加載方式、刷新方式等;
除了以上通用的交互細(xì)節(jié)外,還是有就是動(dòng)效文檔的細(xì)節(jié)了,因?yàn)槠綍r(shí)也會(huì)遇到交互動(dòng)效的輸出;所以,動(dòng)效細(xì)節(jié)的標(biāo)注也是蠻重要的,具體包含以下幾個(gè)細(xì)節(jié):
(1)動(dòng)效名稱:比如搖晃、哐啷、跳躍、彈跳等;
(2)動(dòng)效參數(shù):動(dòng)效時(shí)長,一般以毫秒為單位;是否延遲,延遲多久等;
(3)觸發(fā)邏輯:什么時(shí)候觸發(fā)動(dòng)效及多個(gè)動(dòng)效出現(xiàn)的順序等;
四、需求開發(fā)驗(yàn)證:
開發(fā)結(jié)束之后,還要對需求進(jìn)行驗(yàn)證/驗(yàn)收;我們驗(yàn)證的方式有以下三種:
(1)測試部門測試:這個(gè)環(huán)節(jié)當(dāng)然是必須的,是保證需求順利上線的重要一環(huán);
(2)需求方測試:在測試部門測試的時(shí)候,需求方也會(huì)介入進(jìn)行業(yè)務(wù)邏輯、產(chǎn)品邏輯、交互邏輯及視覺展示的測試;參與的有:產(chǎn)品、交互、UI、運(yùn)營、市場等等;
(3)種子用戶內(nèi)測:在以上方式結(jié)束之后,會(huì)進(jìn)入用戶內(nèi)測階段,將最終的方案打包發(fā)給用戶去體驗(yàn),發(fā)現(xiàn)問題,然后進(jìn)行修復(fù);
等到用戶內(nèi)測結(jié)束之后,所有問題都修復(fù)解決了,才能最終發(fā)布上線,這樣我們能保證整個(gè)的方案是可行的,用戶在使用的過程中不會(huì)出現(xiàn)大的紕漏。
好啦!今天先給大家分享這么多,如想學(xué)習(xí)掌握更多UI設(shè)計(jì)知識(shí)請搜索關(guān)注新浪微博:UI設(shè)計(jì)傳,回復(fù):UI,贈(zèng)送UI設(shè)計(jì)資料,你所關(guān)注的人,將決定你看到的世界。
掃描二維碼推送至手機(jī)訪問。
版權(quán)聲明:本文由飛速云SEO網(wǎng)絡(luò)優(yōu)化推廣發(fā)布,如需轉(zhuǎn)載請注明出處。