【個(gè)人總結(jié)】添加標(biāo)簽設(shè)計(jì)
app添加標(biāo)簽設(shè)計(jì)思考,一個(gè)相對完成的設(shè)計(jì)流程和產(chǎn)品訴求出發(fā),涉及交互樣式和流程的設(shè)計(jì)方法和思路
2015.09.24
標(biāo)簽設(shè)計(jì)。主要是給與用戶上傳的內(nèi)容添加標(biāo)簽,這類標(biāo)簽主要有一下幾點(diǎn)作用:
1.便于找到相似標(biāo)簽好友,提高產(chǎn)品社交屬性;
2.便于歸類內(nèi)容,便于用戶和后臺(tái)進(jìn)行數(shù)據(jù)抓?。?/p>
3.便于運(yùn)營相關(guān)活動(dòng),提升產(chǎn)品互動(dòng)性;
標(biāo)簽主要是在視頻或照片拍攝/編輯結(jié)束后,在發(fā)布頁出現(xiàn)的功能,發(fā)布頁面具有的通用功能包括:封面(針對視頻而言),圖片縮略圖,標(biāo)題,描述,地點(diǎn),標(biāo)簽,@他人,隱私權(quán)限,分享/同步到 幾項(xiàng)信息,其中按照產(chǎn)品定位的權(quán)重及應(yīng)用本身的屬性特質(zhì),幾點(diǎn)內(nèi)容在呈現(xiàn)樣式上會(huì)有一些顯著的差異,如in和nice兩款圖片美化應(yīng)用與微博:



在此次設(shè)計(jì)過程中,類似in的發(fā)布過程,主要對標(biāo)簽設(shè)計(jì)進(jìn)行總結(jié)。
1.首先是入口,在頁面中需要留出添加標(biāo)簽的位置,同時(shí),考慮到用戶可能重復(fù)添加標(biāo)簽,或者有些應(yīng)用的添加標(biāo)簽機(jī)制是單次添加,不支持多次添加,因此標(biāo)簽區(qū)域要有可多次添加的隱喻,或者帶出較強(qiáng)的添加指向性,如圖所示:

2.添加過程
添加標(biāo)簽頁面,往往需要用戶的額輸入操作,因此普遍做法是跳轉(zhuǎn)到下一級(jí)頁面,承載更多的用戶操作。
在添加標(biāo)簽頁面中,可放置如下功能或內(nèi)容:

其中,按照不同的產(chǎn)品需求,可能衍生出各種設(shè)計(jì)樣式,如:
(1)只可單次添加一個(gè)標(biāo)簽,添加后自動(dòng)返回,如微博和in;


該設(shè)計(jì)樣式不支持在當(dāng)前頁面連續(xù)添加或刪除操作,因此僅保留搜索框即可。當(dāng)前的添加標(biāo)簽操作是單向的,不會(huì)有反復(fù)添加、修改的問題,因此 路徑的流暢性 是影響體驗(yàn)的主要問題,即用戶搜索過程中可添加新標(biāo)簽,或者從搜索sug列表中選取推薦的標(biāo)簽時(shí),要保持信息呈現(xiàn)清晰,不要放置過多分散用戶注意力的冗余信息,例如當(dāng)用戶搜索時(shí),搜索sug列表是層級(jí)最高的,常用標(biāo)簽、推薦標(biāo)簽等內(nèi)容全部被隱藏掉,以便用戶可快速定位選擇,選擇成功后立即跳出該頁面返回上一級(jí)頁面,再次添加新的內(nèi)容而不會(huì)有反復(fù)操作的厭煩感。
其實(shí)這里還可細(xì)分的是是否支持用戶添加新標(biāo)簽。不支持用戶自定義標(biāo)簽是一個(gè)輕量化的交互樣式。如果不支持用戶自己添加新的標(biāo)簽,直接將焦點(diǎn)定位到搜索框,同時(shí)呼出輸入法是一個(gè)更為直觀的方法,不給用戶其他的操作選擇,如果輸入結(jié)果不支持或無結(jié)果時(shí),則無法添加標(biāo)簽。
(2)可添加多個(gè)標(biāo)簽
該樣式的添加標(biāo)簽頁面,承載的功能更多,后臺(tái)涉及到的接口與單次添加相比也是工作量直線上升的,因此在前端的交互設(shè)計(jì)中需要考慮到壓面信息的權(quán)重,以及標(biāo)簽的具體添加、刪除,甚至排序等交互操作的實(shí)現(xiàn)方式。
由于可添加多個(gè)標(biāo)簽,在完成所有標(biāo)簽前當(dāng)前頁面是不跳轉(zhuǎn)的,因此需要在用戶每完成一個(gè)標(biāo)簽輸入后,都有確定的操作給后臺(tái)反饋,告知這是一個(gè)新的標(biāo)簽(或者完成后給出統(tǒng)一的反饋,具體技術(shù)機(jī)制了解不全面),同時(shí)前端呈現(xiàn)具體的標(biāo)簽樣式,與基本的輸入文本內(nèi)容區(qū)別開來。
如足跡的添加標(biāo)簽頁面,允許用戶創(chuàng)建和添加新的標(biāo)簽。當(dāng)前頁面可同時(shí)添加多個(gè)標(biāo)簽,支持刪除操作。由于輸入焦點(diǎn)僅可定位在搜索框中,所以標(biāo)簽上需要有明確的X的角標(biāo)提示用戶當(dāng)前標(biāo)簽是可刪除的;


可手動(dòng)添加標(biāo)簽更加直接的應(yīng)用是啪啪。
其標(biāo)簽輸入?yún)^(qū)域與搜索框進(jìn)行了整合,及用戶在該區(qū)域輸入內(nèi)容后,輸入?yún)^(qū)域下方出現(xiàn)搜索sug列表,同時(shí)用戶的輸入內(nèi)容已經(jīng)呈現(xiàn)在標(biāo)簽區(qū)域中,根據(jù)初始頁面的文案提示,若sug列表里無用戶中意的標(biāo)簽,用戶可點(diǎn)擊輸入法中的逗號(hào)將其作為新標(biāo)簽添加,同時(shí)焦點(diǎn)下移,用戶可立即進(jìn)行下一標(biāo)簽的輸入操作。但是從頁面可發(fā)現(xiàn),期標(biāo)簽區(qū)域無表示刪除的角標(biāo),因此止咳支持通過鍵盤上的刪除鍵進(jìn)行刪除標(biāo)簽操作。但是不知是否由于技術(shù)原因,點(diǎn)擊鍵盤刪除標(biāo)簽時(shí),第一次點(diǎn)擊是標(biāo)簽高亮顯示,再次點(diǎn)擊才可刪除標(biāo)簽,如果是有意這樣設(shè)計(jì)的,個(gè)人感覺倒是有些畫蛇添足了。
就總結(jié)這些吧,吃中飯去了~







































