評論
由于微信公眾號輕應用的設(shè)計需要在微信的結(jié)構(gòu)框架中進行,信息架構(gòu)和導航布局需要基于微信的開發(fā)接口和架構(gòu)來做,項目開始時微信針對公眾號的導航框架剛好有做出調(diào)整,在進入公眾號里面的頁面后可以逐級返回上一級頁面,而不是之前直接返回到公眾號首頁。在微信改版之前,也做了一套微信輕應用交互模板,由于輕應用導航欄的調(diào)整,頁面留出了更多內(nèi)容顯示空間,頁面操作也流暢了許多。
圖1可以看出,如果在輕應用頁面上要返回上一級頁面,需要設(shè)計一個單獨的導航條,這樣和微信已有的導航欄并在一起形成了雙導航欄,頁面顯得雞肋,出了占用屏幕空間外,操作起來也很累贅,還容易導致點擊錯誤。
所以在新設(shè)計的輕應用,去掉了先前的導航欄,增加了頁面空間。
某商城需要創(chuàng)建自己的微信公眾號,用戶能在公眾號上購物、注冊成為會員、綁定會員卡、會員卡充值和積分兌換。(購物第一期不做)
分兩個角色——商家和會員(消費者),兩個場景——商城和會員卡。對于商家來說:通過商城為消費者(會員)提供購物消費場地;對于會員(消費者)來說:進入商城就是消費者,購物消費就是會員,消費軌跡儲存在會員卡
由于第一期商城不做,分析會員卡的使用場景繪制了流程圖,生成信息架構(gòu)圖
兩個角色:商家(商城)和用戶,兩個場景(節(jié)點):商城和會員卡
首頁有消息推送和兩個入口(商城、會員中心),消費者在實際購物中,就是帶上錢包(銀行卡)走進商場挑選自己喜歡的商品,也就是說,如果消費者要成功購買到商品,有兩個必須具備的,一是有商場,二是有錢(很重要)。所以把商城入口和會員中心放在首頁。會員中心包含:“會員卡” “我的資料”? “問題反饋”? ,這里的會員卡實質(zhì)涵蓋了錢包的功能,在第一次關(guān)注成功后,系統(tǒng)會推送一條歡迎加入的消息,提供 “激活會員卡”入口,也可以直接點擊會員中心〉會員卡〉激活會員卡
(1.0版本完成會員中心模塊的設(shè)計,2.0版本完成商城模塊的設(shè)計)
由于要考慮到線下已辦理會員卡的用戶,在第一次設(shè)計的時候,分了兩個的入口,有會員卡的選擇綁定,輸入會員卡號碼,新會員選擇激活,輸入手機號碼
設(shè)計出來后,感覺讓用戶去選擇入口激活,用戶容易出錯,而且體驗不流暢
最后和需求的小伙伴溝通,問了商城業(yè)務人員,其實消費者在線下辦理會員卡時,需要填寫手機號碼,這一點很重要,因為新會員激活時也需要手機號碼,于是統(tǒng)一使用手機號碼來激活,如果已有在實體店辦理會員卡,會給出提示再進行線上激活,如果之前沒有辦理,默認手機號為會員卡號,直接激活,然后修改交易密碼
第二稿的設(shè)計智能化了,體驗流暢很多
會員卡頁在第一稿設(shè)計的時候,頂部為banner區(qū)域,商品廣告向用戶推送,但最后和需求小伙伴討論后,決定不放廣告推送,理由是這個輕應用中已經(jīng)有獨立的商城入口,消息推送也會涉及到商品的推送,輕應用本質(zhì)就是輕,作為用戶來講,錢包里(會員卡)更希望是私人的,比較有安全感,但可以保留,給商城方自己來決策。
于是把banner區(qū)域換成一張會員卡貼圖,根據(jù)會員級別(由消費情況、積分、年限來決定)的不同顯示不同的貼圖,就如線下的白金卡、vip卡同理,出了享受的折扣、服務不一樣外,也是會員身份的象征。
作為商城方,希望消費者充值更多的錢到會員卡中,增加在本商城的消費額度,留住消費者,于是提供了充值即享受折扣的消費策略,來刺激消費者充值,采用類似于購買購物卡的充值方式設(shè)計,這里邊有包含消費者消費行為的考慮,一般在購買商品的時候,商品的價格出現(xiàn)整數(shù)的情況比較少,如果采用整數(shù)充值,能夠保證會員卡上有余額,誰會愿意浪費自己的錢呢?
消費者作為應用的用戶,操作越簡單,花費時間越少越好,這種設(shè)計也避免了用戶輸入,直接選擇面值即可充值(微信支付)
訂單詳情頁的設(shè)計主要考慮在不同網(wǎng)絡(luò)環(huán)境下查看詳情,默認為圖文顯示,如果是網(wǎng)絡(luò)環(huán)境較差,加載很慢時,也可以主動切換到文本顯示查看,縮短用戶等待時間,提升用戶體驗。
視覺設(shè)計師小哥超帥了,給我的感覺是他一稿就通過的(哈哈),最后的效果也是棒棒噠(點贊),上圖…
會員卡激活成功
會員卡中心
會員卡充值
訂單圖文詳情
微信公眾號在14年10月份上線,不論是消費者或合作方反響都很好,也使我們順其自然地拿到了二期商城開發(fā)的合約
雖然是個輕應用,項目不大,在設(shè)計的時候,思考的地方不少,是一個不斷協(xié)調(diào)的過程,和需求、視覺、開發(fā)的小伙伴也討論很多,做平衡不容易,每個設(shè)計師都會有自己不同的設(shè)計思維和方法,目標都是解決問題并推動項目向好的方向發(fā)展。第一次把做過的項目經(jīng)歷發(fā)布出來,表述有很多不足之處,希望指正,一起交流 ???
最后,感謝視覺小哥的供圖 ?thx!
作者:村邊火車
來源:http://www.jianshu.com/p/cb1ec701d61b
公眾號叫啥啊,我想看看 0.0
嗯嗯