每天記錄一個看對眼的小設計谣旁、小交互卿叽。
冒昧得揣測一下設計師背后的心意桥胞,望見諒。
感謝世間所有充滿創(chuàng)造力的大腦考婴、所有勤勞能干的雙手贩虾、還有能看見美好的眼睛。
今天分享一個旅游APP——馬蜂窩旅游 APP V10.1.1 首頁的設計小驚喜
上滑縮進效果
【舵式拓展導航欄】
馬蜂窩APP拋棄了傳統(tǒng)的底部tab欄導航沥阱,用了舵式拓展形式的導航欄缎罢。舵式導航欄的優(yōu)勢在于突出核心功能——發(fā)布圖文游記。另外還能夠充分減小導航欄的屏占比考杉,拓展了正文區(qū)域策精。
下滑操作展開及下拉刷新
【滑動過程縮進及展開】
APP將用戶滑動操作和導航欄的樣式變化做了關聯(lián),多見于瀏覽型的頁面中崇棠,例如文章蛮寂、瀑布流信息等。用戶在進行連續(xù)上滑手勢操作時易茬,判斷用戶正專注于閱讀頁面正文內容信息酬蹋,此時將banner位進行隱藏、舵式導航欄無關的功能縮進抽莱,減少對頁面的遮擋范抓,提高用戶閱讀效率。
在用戶進行下滑手勢操作時食铐,判斷用戶已經中斷閱讀丐谋,此時展開導航欄击纬,將更多的后續(xù)操作選擇展示給用戶并扇。在展開過程中琼腔,APP細致得將發(fā)布按鈕做了一個縮小的操作,和另外兩個功能按鈕形成更加和諧的比例斟叼∨蓟荩滑至頭部時,進一步展示banner位內容朗涩『瞿酰滑至頂部時,和很多APP的交互一致,馬蜂窩也調取了刷新頁面的功能兄一,但馬蜂窩還是做了一些不一樣的小驚喜厘线,除了下拉的刷新圖標動效外,此時舵式導航的首頁圖標也變成了“刷新”圖標動效出革,在刷新完成后造壮,又變回首頁圖標。這一套流暢的圖標變化動效值得學習骂束。