因本文內容由大量GIF演示內容,加載速度稍慢請耐心等候
本文翻自Brian Lovin在2015年2月24日發布的“Design Detail:Instagram for iOS”,轉載請注明出處
原文地址:http://blog.brianlovin.com/design-details-instagram-for-ios/#1
Podcast地址:http://designdetails.fm/
Instagram Design Detail(上):http://www.lxweimin.com/writer#/notebooks/595459/notes/804793
以下為本人的翻譯內容:
10、點按對焦
雖然這塊沒什么亮點,但是我很喜歡的是,當你在拍照時點擊拍攝區域時,會出現一個脈沖震動式的對焦環!就我個人而言這個脈沖環的動畫效果有點太快了,相較于app眾的其他過度動畫效果有點不和諧。我希望它可以給我更慵懶一點的感覺。
11、編輯切換
當你在編輯添加濾鏡時點按照片時,你可以快速比對目前編輯的與原始的圖片。使用某一具體的工具(這里是飽和度),點按該圖片可以比對這一具體工具的使用前后效果。
12、重排濾鏡
最近Instagram更新的一個內容,就是讓用戶可以通過重新排列或隱藏濾鏡,幫助用戶更高效的使用他們喜愛的濾鏡。這個功能使用的交互方式,讓使用的體驗非常棒。
這里我只想到一個優化的地方,就是在隱藏濾鏡的時候,增加一些反饋效果,幫助用戶進一步了解這些隱藏的濾鏡去了哪里?如何重新放回來?隱藏的操作是把某一濾鏡拖到“hide”區域內還是空白區域即可?
13、添加濾鏡
這里有個細節非常微妙卻大大增強了Instagram的編輯體驗:
當你使用濾鏡或工具編輯照片時,并沒有立刻就在照片上展示這些變化,取而代之的是快速閃現一下你的原照片,然后從邊緣開始快速的實現編輯后的效果。
14、添加標簽
看完20遍視頻演示后才明白這是怎么一會事兒。Instagram上添加標簽這件事兒涉及大量的細節和交互。這些小細節包括,搜索用戶名時背景上的半透明遮罩,刪除標簽時的彈性效果。這一切的細節匯聚到一起形成了優秀的使用體驗。
15、二次確認
我曾猶豫是否要提這個細節,因為大部分人應該都有用過,但還是提一下吧。
當你準備發布照片時,你可以點擊縮略圖查看最后一眼照片來確認效果。每次在Instagram上發布照片時我都會使用這個功能來確保發布的照片是我覺得滿意的。
16、反向操作
終于在2015年大部分的app在這方面開始變好了,但我不得不再次強調:app中通過視圖和流程的連續引導,幫助用戶了解“現在在哪里”,“之后去哪里”是至關重要的。Instagram在照片編輯流程上的反向操作方面做的非常出色。
17、相機膠卷的快速啟動
暫時就提一個亮點:點按相機icon后直接跳到相機膠卷。我的承認,今早重點研究不同的設計細節時,我才發現了這個交互,但這也變成我在Instagram上添加照片的默認方式。省略一步操作讓用戶在過程中感覺更智能這種做法深得我心。
18、歡迎界面
當你注銷賬號時,背景的歡迎界面的色彩隨著時間而轉變。這個變化非常的慢,當我第一次注銷的時候甚至都沒發現。
多年來我至少可以描述出三種不同的Instagram歡迎界面——每種都有截然不同的體驗和風格,最新版本的歡迎界面非常有意思。無論原因是什么,這種設計并不符合Instagram的整體(不論是app還是web)設計風格。如果Instagram內部有人可以分享做這個功能點原因,我很愿意了解一下!
19、修剪
Instagram的朋友提醒了我這個小細節,真的很棒!如果你在視頻編輯倒入了一個長度超過15秒的視頻片段的話,app會出現一個彈動效果的剪刀icon提示你的視頻已經被修剪過了。之后你可以點擊剪刀icon來編輯修剪的視頻范圍。我非常欣賞這種用微妙的動畫效果來抓住用戶眼球,并引導他們下一步操作的做法!
感謝大家的支持和鼓勵,之后不定期的翻譯一些關于優秀app設計和體驗方面的文章。