<label id="jgr5k"></label>
    <legend id="jgr5k"><track id="jgr5k"></track></legend>

    <sub id="jgr5k"></sub>
  1. <u id="jgr5k"></u>
      久草国产视频,91资源总站,在线免费看AV,丁香婷婷社区,久久精品99久久久久久久久,色天使av,无码探花,香蕉av在线
      您正在使用IE低版瀏覽器,為了您的雷峰網賬號安全和更好的產品體驗,強烈建議使用更快更安全的瀏覽器
      此為臨時鏈接,僅用于文章預覽,將在時失效
      專欄 正文
      發私信給百度MUX
      發送

      8

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      本文作者: 百度MUX 2016-01-09 11:43
      導語:如果你理解和創造一個令人感到驚艷的應用,那么它需要有一個很酷的故事和令人印象深刻的視覺設計,但其實還不夠。

      【編者按】文章來自百度MUX翻譯小組,應作者要求,如文章已獲雷鋒網授權轉載,也請保留原標題。

      譯者注:本文譯自UXPin出品的電子書Mobile Design Book of Trends 2015&2016中第五章Delightful Microinteraction。這本電子書結合豐富案例講述了2015-2016年間重要的移動設計趨勢,共有6個章節:靈巧的手勢操作、層級化的移動界面、雋永的字體排印、扁平化設計、愉悅的微交互、小卡片。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      如果你理解和創造一個令人感到驚艷的應用,那么它需要有一個很酷的故事和令人印象深刻的視覺設計。但其實還不夠,它需要更多——能夠與用戶建立起聯系和讓用戶覺得這應用是有生命的。


      這就是為什么微交互存在的原因。

      微交互是創造一個驚艷應用的神秘配方。用戶接觸到這些微交互的瞬間,會出現意想不到的喜悅,然而除了設計師,使用的人幾乎感受不到這些瞬間的存在。

      你每天都會體驗到上百次微交互——

      例如每當你關掉鬧鐘;看到消息閃現在屏幕;提示你在玩游戲;跳過一首歌的播放甚至在你早上上班時根據交通警報改變你的路線。

      每一個微小的瞬間形成了不同的微交互。雖然你不會去思考這些細節,但每一個微交互都會影響著你是否以后繼續使用這些應用。

      什么是微交互?

      微交互可以是用戶任何一次基于任務與設備發生的接觸,用戶很少意識到大部分正常工作的微交互出現在什么時候,是怎么發生的,或者長什么樣子。

      正如Dan Saffer’s寫的書(高度推薦)描述,微交互幫助實現了三個特定功能:

      ? 快速溝通或反饋


      ? 操作結果可視化?


      ? 幫助用戶操作屏幕上的元素

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      例子:Slack)

      Slack是一款集以上三個功能于一身的優秀應用。Slack讓用戶在一個封閉對話流里進行溝通,可以添加附件,單個標記。Slack會給用戶實時更新狀態(例如標記信息已讀狀態),還幫助用戶瀏覽周圍,使用推送消息提醒和其他形式使用戶同步共同內容。

      微交互在不同方面影響著用戶和應用功能:

      ? 關掉或打開某元素

      ? 在任何數字媒介中進行評論

      ? 改變一項設置和進程

      ? 查看通知或消息

      ? 下拉屏幕來刷新內容?

      ? 與數據元素進行交互,如查看天氣

      ? 完成任何單一任務

      ? 連接設備,例如多玩家游戲或使用你的筆記本電腦連接打印機

      ? 在網站上對圖片或視頻進行分享或點贊?

      簡單來說微交互就是用戶的一個動作觸發了設備的另外一個動作。每個交互設計動作是建立在以用戶為中心的設計理念,數字工具的工作和功能反映用戶的實際操作。這也是讓交互設計可以符合人類操作習慣的秘訣。

      微交互真正的作用是什么?

      正如你從上面的列表所看到,其實沒有很好的結論能總結所有的微交互。微交互服務于多規則,但具體地說,它們應該創造更多互動。

      當你考慮如何設計一個微交互時,不僅要思考這個具體的動作或者任務,還要清楚這個作為用戶的操作流程中一部分的微交互的作用是什么。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Elevate)

      從本質上來說,微交互應該是讓用戶的身體感覺或者做一些事情?:

      ? 觸摸屏幕

      ? 高興地笑

      ? 學習或理解事物

      ? 連接其他用戶

      Elevate應用使用這些操作事件來搭建游戲形式的學習界面,用戶必須觸摸屏幕才能回到問題和修改答案,頁面上漂亮的動畫可以取悅用戶。這應用的目的是為了幫助用戶訓練大腦。(設計這個圖片型游戲是為了更好地幫助你去理解和使用語法)用戶可以分享他們的分數和結果給他們的朋友和其他用戶。這聽起來像一個很簡單的游戲,對吧?但這些其實都是用戶期望從幾乎每一個應用看到的東西。

      這些行為都是為什么需要微交互的核心。這些小而輕的“數字時刻”被視為一種情感聯系。微交互允許用戶感覺或接觸另外一個用戶或對象。 

      微交互的4個元素

      最早研究微交互的是Dan Saffer。

      只需google一下“微交互”,每條結果里的相關信息基本都會出現Dan Saffer這名字。 他寫了一本全關于微交互的書。Saffer聚焦在微交互的四個結構——這是最好的方法去理解并創造它們。

      ? 觸發器:啟動微交互。舉個例子,我點擊了一個心型圖標去點贊一個頁面。


      ? 規則:在交互里發生了什么。用戶不能“看見”這些規則,但可以通過反饋(下一個頁面)明白這些規則。在這案例,點擊心型圖標會增加這個頁面的內容到用戶的信息流里。


      ? 反饋:讓你明白在微交互里發生了什么。心型圖標用顏色填充以及會跳動,伴隨著動效漸變消失的“安全地加入信息流”消息通知用戶發生了什么。


      ? 循環和模式:決定微交互動作的時長和以及隨著時間如何重復和發展的。舉個例子,我們現在所描述的微交互,甚至可以提醒我們6個月前第一次點贊的頁面。

      每一個交互的細節都應該告知用戶,作用是什么。正如Saffer所說的,大多數人甚至不知道微交互有什么用,除非在使用中出了問題。

      你是否正在考慮如何反饋?

      反饋是微交互循環中的最重要的部分。這是微交互連接用戶和接口的階段。反饋決定了微交互將究竟是如何工作的。

      試想一下,你需要7點起床所以需要在你手機上設置一個鬧鐘。當鬧鐘響起來時你會做什么?你是起床來關掉這鬧鐘嗎還是繼續再睡一會兒?

      這個細小的動作告訴你應用需要什么微交互——重新設置鬧鐘的下一次鈴響或者自動延后9分鐘再響鈴。這個在用戶和系統之間的反饋循環是完整的。沒有用戶的操作,它沒有被重新設置,鬧鐘的聲音永遠不會停止。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Wunderlist)

      這同樣適用于核對代辦事項列表事項時,就像上面的Wunderlist應用。

      當你在一項時間上打勾時就意味著這個應用應該用微交互反饋你剛剛打勾的行為。你瞬間明白哪些事項是完成的,哪些是還沒做的。

      雖然這是個簡單的例子,但我們可以從中學到很多。

      至少,它告訴我們,用戶想要通過應用中的微交互清楚的制定下一步,并且希望它可以隨著時間和操作很直觀地演變。

      設計細節是微交互的核心

      設計微交互以及怎么處理細節將成就或破壞你的項目,交互是一個你不能忽略的重要設計元素。

      但是你應該怎么去使用它?什么是你需要思考的?

      ? 微交互必須能通過重復使用才能驗證它的價值。有一些微交互第一次使用可能感覺新奇有趣但往后的100次使用可能會成為煩人的微交互。對于噱頭和古怪的設計一定要慎重小心。

      ? 簡單的規則。簡單的樣式,簡單的語言,簡單的顏色以及簡單的設計。不要設計出比功能還復雜的微交互。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Dark Sky)

      ? 賦予微交互人類的聲音。文案讀起來就應該像人說的話,不應該像一臺機器。

      ? 在復制上要多留心。你使用的文字和語言必須與此時的情景匹配。如果只使用文字,那么需要保持文字是簡單,健談和有用的。

      ? 增加有趣但不要太瘋狂的動效。MacBook的Dock上一個彈跳的圖標可以認為是一個程序在加載,它能讓你知道這個程序正在響應但又不會妨礙到你現在的任務。

      ? 你現在設計的東西必須與其他元素保持視覺和諧。如果你的應用使用藍色為主調,那么你設計的微交互就應該使用相同的色調,這樣才能在視覺上與你的主設計保持一致。盡管對比是很好的設計方法,但還是要謹慎地使用它。

      ? 請不要過分思考微交互。過分設計是致命的,例如簡單的文字消息通知,只需要在屏幕上簡單地展示足夠的信息已經很有效了,例如展現這消息的發送者,內容以及如何去回復它。

      ? 仔細地考慮每一個細節。因為微交互是如此的微小,每個設計的元素都很重要。確保每一個細節,在發布應用前確保最后一像素也是完美的。

      ? 請考慮微交互的拓展性。它對于每個用戶每一時刻是否都是完全一樣的或者可以改變的?(考慮上面提到過的鬧鐘例子,每一次點了“再睡一會”按鈕,鬧鐘聲音會變得更大)。更細微智能的細節會產出最棒的微交互。

      將微交互合并到設計中的方法 ?

      這里有好多方法去思考如何將微交互融入到設計中。沒準你實際上已經設計了一段時間,但沒在微交互設計投入時間。

      每一個微交互的支柱都是由精心設計過的動效組成的。(你可以從免費的電子書《交互設計和動效》中學習更多關于動效設計的知識)

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Apple)

      舉一個近些年最好的微交互之一的例子。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Apple)

      在iOS9中的拍照應用中,增加了一個叫“生動” (live photo)的功能,當一張照片是“生動的”,它其實更像Gif一樣被記錄,有趣微交互的竅門是如何讓應用保持瞬間的痕跡。

      當你拍了一張你的小狗的照片,它在照片里伸出它的舌頭。在相冊里照片是完全靜態的。但當你輕按照片,屏幕模糊的一剎那,它變成“活”的照片,展示你幾秒鐘狗的呆萌(甚至聲音)。Gif和視頻都不是新的技術,但在這里的混合卻使照片變得非常獨特。事實上,如果你在照片間切換,部分照片在過渡時也會有動畫。

      創建一個微交互比拍一個視頻要簡單(只需要堅持循環按播放鍵),也比Gif更具有沉浸感。生動照片(live photo)讓用戶回到過去再次體驗當時完整的瞬間。相冊不僅僅是個旋轉木馬,也是一個可移動的裝載人們的記憶和感覺的地方。為了重建標準相冊應用的微交互,蘋果實際上引發了改變相當大的體驗。蘋果實際引發了一次相當大的變革。

      當然,這里還有很多事情你可以在你的應用里體現你的微交互。有兩個最常用的體現:使用通知以及點擊按鈕或鏈接的動效。每一個方法都會促進使用率和可用性。

      當你決定如何設計微交互時,你需要考慮用戶第一。背后的關鍵概念是微交互的可用性:

      ? 一觸碰=一個動作(例如一個分享,或者在我們前一個例子里的觸發一個照片動效)


      ? 預測用戶下一步的操作。在生動照片的例子中,動態的照片過渡延續了用戶滑動照片產生的微交互。蘋果知道,人們當觸發了第一張照片時會繼續瀏覽后面的圖片,所以它保持一致性的體驗。

      一旦你有了這一發現,你必須讓這個微交互幾乎看不見。我們不能反復強調,微交互必須是感知很弱的。就像一段好的魔術,觀眾不需要看到觸發,規則,反饋和緩解的整個過程,觀眾只需要知道應用完成他們想要做的。如果你可以達到想變魔術一樣的感覺,你將會有更多機會讓用戶使用這個微交互。

      下一步是什么?

      我們只是剛開始接觸微交互設計,它將會在重要性和范圍不斷增長。雖然有好多關于手機應用很好的例子,但微交互也會在穿戴式設備或用在家庭里的智能設備等小型應用里成為最為突出的設計元素。

      在小屏幕上也同樣重要,可以說在穿戴式設備上微交互更重要,因為屏幕實在太小所以每一個交互都必須是一個單步過程。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Nike Running)

      思考一下耐克跑步這個應用。不僅因為它與你手機上的其它應用進行跨界整合(例如Health和Spotify),它也在Apple Watch上提供一個完整的微交互體驗。從現場紀錄你的里程到從你的朋友那得到贊,微交互使穿戴式平臺的應用變得更加可用。

      機器人將集成微交互規則。從家庭安全設備到舒適控制清潔設備,可交互的機器人與連接的應用程序會創造一個與迄今為止我們所看到完全幾乎不一樣的體驗,并將基于微交互而“工作”。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Cox Homelife)

      家庭安全設備和電視電纜提供商Cox是目前嘗試家庭安全系統的眾多公司之一。當你的家整合了智能家庭安全設備,你在看視頻時燈會自動關掉。(這套系統也可以告知你的寵物正在你的家里搗亂)

      恒溫器設備Nest也使用微交互當作工具去學習設置你習慣的溫度,使你的家變得更舒適。每一個智能型工具都會連接你手機上的應用去提供反饋和使用它時提供更好的互動。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Google Material Design)

      微交互會繼續進化并相互影響。在Google的Material Design文檔里你可以找到一些關于微交互的很好的實用建議。微交互這概念將超越功能,也會去闡述每一種元素,例如觸摸,手勢甚至美學。

      “響應式交互讓用戶的操作有及時的,有邏輯的,令人愉悅的屏幕反應,這有利于用戶對應用的深入探索。每一個交互都需要通過深思熟慮,也許它是異想天開的,但絕不能使人分心。我觸摸了屏幕會發生什么?那我觸摸了這個圖標呢?”

      微交互能更好地促進應用更好地連接物理世界。通過Beacons與用戶連接,微交互變得更普遍。

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      (例子:Target Cartwheel)

      回想一下2002年的“少數派任務”這部電影,湯姆克魯斯辦演的角色在購物商城里行走,廣告牌會根據他想要的直接推送廣告給他。這個也能在應用里實現,在一些地方例如Target,當你到達特定位置,Target會通過定位工具來嘗試推送一些交易,優惠券或降價信息到你的手機上。

      結語

      微交互是一個應用設計里的核心成分,它影響你的用戶是否愿意使用這應用,提高使用度,以及愉悅用戶。把這些放在一起,你需要設計一些瞬間那是用戶不知道,但是需要的,或用戶希望你的應用是他們日常生活中的重要組成部分。

      另外,對設計有興趣的童鞋,部分資源和工具可進入原文查看。

      Via:Mobile Design Book of Trends 2015&2016

      譯文僅作學習用途,如有其它用途請聯系原作者。譯文轉載請注明:本文來自MUX原創翻譯,雷鋒網發布,譯文作者:MUX翻譯小組

      keep calm and be awesome.

      推薦閱讀:

      1、2015-2016年最流行的APP設計是什么?比如,Facebook那樣的

      2、2015-2016年最有影響力的移動界面設計是什么?看看Google就知道了

      雷峰網原創文章,未經授權禁止轉載。詳情見轉載須知

      2015-2016最懂你的移動設計是什么?哦,iPhone就可以告訴你

      分享:
      相關文章

      專欄作者

      百度移動用戶體驗部(Baidu Mobile User Experience Department)成立于2009年,簡稱百度MUX,是百度移動服務事業群組核心部門之一。自成立以來,一直堅持以用戶為中心并持續提升產品體驗為終極使命。始終追求著“簡單極致”的設計理念,負責百度所有移動產品的視覺、交互和用戶研究方面的工作,致力于設計行業內最優秀、體驗最好的移動產品。MUX官網 http://mux.baidu.com/
      當月熱門文章
      最新文章
      請填寫申請人資料
      姓名
      電話
      郵箱
      微信號
      作品鏈接
      個人簡介
      為了您的賬戶安全,請驗證郵箱
      您的郵箱還未驗證,完成可獲20積分喲!
      請驗證您的郵箱
      立即驗證
      完善賬號信息
      您的賬號已經綁定,現在您可以設置密碼以方便用郵箱登錄
      立即設置 以后再說
      主站蜘蛛池模板: 亚洲色诱| 江口县| 18禁止看的免费污网站| 在线精品自拍亚洲第一区| AV秘 无码一区二| 九九成人| 国产三级在线看完整版| 99久久久无码国产精品秋霞网| 无码粉嫩虎白一线天在线观看| 国产乱码一区二区三区四区在线| 最新亚洲春色AV无码专区| 四川丰满妇女毛片四川话| 呼伦贝尔市| 国产精品欧美福利久久| 国产野战AV| 激情国产av做激情国产爱| 最新亚洲中文字幕在线| 国产在线啪| 开心五月婷婷综合网站| 国产欧美中文字幕| 亚洲精品a| 亚洲日韩在线中文字幕第一页| 制服丝袜中文字幕在线| www黄片| 亚洲精品国产成人| 国产v片 | 三上悠亚在线精品二区| 专干老熟女A片| 狠狠做深爱婷婷久久综合一区| 亚洲成人自拍| 97久久超碰国产精品2021| 久久久久久免费一区二区三区| 另类专区欧美在线亚洲免费| 99精品无码一区二区| 精品一区二区三区东京热| 少妇做爰免费视看片| 黔南| 风间由美性色一区二区三区| 91嫩草在线| 少妇久久久久久久久久| 1024欧美日韩|