移動應用設計趨勢:神奇的微交互

      作者:
      分類: 觀點/經驗
      2016-01-13
      1217

      開發(fā)一個APP并上線了,你會覺得很了不起,同時呢它還有一個很酷的故事和視覺設計令人印象深刻。但這是不夠的,它需要更多的東西,要讓用戶感覺這些元素活著。


      這就是微交互!

      Image title

      圖片來源:uxpin


      當談到設計一種上癮的APP微交互的秘訣時。其實是少不了用戶的角色,這些設計時刻保持用戶的參與進來才行,才能夠創(chuàng)造出意想不到的喜悅。你一天可能遇到數百次微交互的情況,每一次你關掉提示音、看到短信在屏幕上閃爍、提醒你在一場比賽中、跳過一首歌在音樂播放器或者你改變基于交通課程提醒你在早上上班。這些微小的每一個時刻形成的微交互,很有可能你不想任何人,但每一個有助于你為什么不斷地使用特定的應用程序,一天又一天。


      微交互是什么?

      微交互與設備的所有單任務的參與有關,大多數這些活動僅僅是明顯的,交互動作很光滑,Dan Saffer也說到,幫助完成特定功能的微交互作用有三個:


      1.狀態(tài)的快速反饋

      2.想象動作的結果

      3.幫助用戶操作屏幕上的東西


      Image title

      來源:Slack


      上面的Slack,是一個偉大的應用程序,并在一個包中所有這三個工作。這個應用程序允許用戶在一個閉環(huán)交流聊天,附加文件和標簽。同時,應用程序提供實時更新(如標記為已讀消息),幫助用戶瀏覽。它還使用通知和其它小行動來保持用戶同步的溝通。


      微交互,影響應用程序的用戶和功能存在多種方式:


      1.事情的開啟狀態(tài)和關閉狀態(tài)

      2.在任何數字媒體評論

      3.更改設置或過程

      4.檢查消息或通知

      5.滑下來“屏幕”在移動設備上更新內容

      6.與數據元素進行交互,如檢查天氣

      7.完成孤立的任務

      8.連接設備,比如多人游戲,或者從你的筆記本電腦打印

      9.共享或喜歡的照片或視頻網站上


      簡而言之,微交互是來自用戶的一個操作,觸發(fā)另一個動作的裝置。每一個交互是基于以人為本的設計理念,在數字工具的工作原理和功能也反映出一個人會做些什么。可用性的秘密武器——交互行為像預期的那樣,“以人為中心”

      Image title

      圖片來源:uxpin


      在上面uxpin的例子中,我們?yōu)槠ヅ鋾r尚模特設計了一個網站原型。一張卡片代表每個模型,顯示度量和名片下載當你停留在人的臉。對于這個特定的情況下,該微交互揭示了信息順暢性,動畫添加了一些的可發(fā)現性,使設計更逼真的響應用戶的動作。


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

      從上面的列表可以看到——絕不是它包括每個微交互服務于多個角色。當你正在考慮如何設計一個微交互時,不僅考慮手頭的特定操作或任務,也應該“做”作為整體的一部分的用戶體驗。


      從本質上講,微交互應該讓用戶感覺或做一些心理的感受:

      1.觸摸屏幕

      2.微笑與快樂

      3.學習或者理解的東西

      4.連接到另一個用戶


      Image title

      圖片來源:Elevate


      上面的Elevate中使用這些組件的游戲式的學習界面。用戶必須觸摸屏幕,為了回答這些問題,正確的答案而漂亮的動畫為取悅用戶,這個應用程序允許用戶來訓練他們的大腦。

      用戶可以與朋友分享成績和結果和其他應用程序的用戶,這聽起來像是對一個簡單的游戲,對嗎?但是這些是用戶期望看到的東西從幾乎每一個應用程序。

      作為指導解釋2015年和2016年的移動設計趨勢,這些行為是為什么微交互工作的核心。這些微小的,輕量級的“數字時刻”感覺,被視為一種情感聯系。微交互允許用戶感受或接觸到另一個用戶或對象。


      微交互的四種元素:

      Dan Saffer 談了微交互的最前沿問題。

      谷歌“微交互”和他的名字是與幾乎所有的主題明確的信息。他寫這本書——毫不夸張地說——在這個話題。Saffer關注微交互四聲部結構,它真的是最好的方式來理解如何創(chuàng)建它們。


      觸發(fā):發(fā)起微交互。例如,我點擊一個心臟圖標來最喜歡的一個頁面。

      規(guī)則:交互行為的方式。用戶不能“看到”規(guī)則,只有了解他們通過反饋(下一階段)。在這種情況下,單擊心臟圖標將頁面添加到用戶的提要。

      反饋:如何設計通信微交互給用戶。心臟圖標填充顏色和跳躍,伴隨著消散”救了喂!”消息通知用戶發(fā)生了什么。

      循環(huán)和模式:決定微交互的長度和它如何重復或隨時間的演化。例如,微交互我們現在描述發(fā)展提供我們的內容收藏頁面,甚至可能會提醒我們在6個月當我們第一次喜歡的頁面。每一個部分存在于每個交互創(chuàng)建一個周期的東西是如何工作的。Saffer描述,大多數用戶甚至從來沒有注意到微交互除非他們打破。


      你考慮反饋嗎?

      微交互周期的反饋是最重要的部分。這是微交互階段,連接用戶和接口。反饋決定一個微交互到底會如何運作。

      這樣想,你需要早上7點起床,鬧鐘在你的手機上。鬧鐘響的時候,你起來關掉鬧鐘嗎?或者你打打盹嗎?這個簡單的行動告訴應用程序微交互接下來——重置警報在接下來的周期或在9分鐘再次離開。用戶和系統之間的反饋回路現在已經完成。沒有最初的用戶反饋,鬧鐘的聲音從未停止。它不重置開式循環(huán)允許它再次工作。


      Image title

      圖片來源:Wunderlist


      與檢查一個待辦事項清單項目是一樣的,比如上面的Wunderlist。通過定時一個復選標記一個項目,你告訴應用程序觸發(fā)的微交互引人注目的項目你的待辦事項列表。瞬間,你現在知道哪些物品是完整和懸而未決。完成一個任務的滿意度進一步鼓勵你完成更多的任務,從而進一步與應用程序交互。

      雖然這是一個很簡單的例子,有很多東西要學。它告訴我們,用戶想參與微交互顯然的方式創(chuàng)建一個下一步(循環(huán)),希望它工作直觀的足夠的,它可以隨著時間的推移而演變和使用。


      設計細節(jié)是微交互的核心

      微交互的設計方式和你如何處理細節(jié)將會制造或打破你的項目,互動是一個必備的設計元素,你不能忽視。

      Image title

      圖片來源:Dark Sky 


      但是你怎么設計呢?你思考什么?

      微交互必須挺過重復使用,避免噱頭或動畫的純粹為了聰明。記得你微交互一定長壽,因為他們感覺不到惱人的長期使用。


      簡單性是關鍵

      簡單的語言,清晰的排版、鮮明的色彩、結構化設計。執(zhí)行基本面良好,不添加任何比你需要更多的細節(jié)。


      微交互感受人類

      文本讀起來應該像人一樣說話,設計應該一切形式的情感交流。介意復制,所有副本都應匹配,應用正確的語氣感到尊重文本,幫助要盡可能的輕松的。

      創(chuàng)建一些有趣的動畫,但要適度。想想OSX反彈新程序加載圖標,動畫程序告訴你,但它不負擔你當前的行為的反應,爭取同樣的有用性在你的動畫,因為他們不僅僅是視覺愉悅,尋求和諧。


      對比是你的朋友,但小心使用它。當你得到特定時刻的用戶體驗,細節(jié)就像色彩理論比你想象的更重要。如果您的應用程序使用一個綠色的配色方案,確保顏色微交互流過。每一刻應該感到視覺連接到更大的應用程序設計。

      想想微交互演變,微交互的第一和第一千次行為是否完全相同?還是隨時間演變?例如,想想警報就響你保持按下小睡。如果你想站有別于其他設計,你必須考慮這些細節(jié)。

      一旦你傳達的信息在一個快速和令人興奮的。讓順利過渡到正常流的任務。


      結論

      微交互是應用程序設計的重要組成部分,人們希望使用。他們幫助創(chuàng)造接觸,有助于用戶功能和愉悅。把它放在一起,你需要創(chuàng)建用戶看不到的微小的時刻,但需要或希望,這樣你的應用是一個重要的日常生活的一部分。


      0
      6
      分享到:

      0

      喜歡他,就推薦他上首頁吧^_^

      推薦閱讀

      ×

      賽事服務聯系方式

      0371-86068866

      4008887269

      cndesign@163.com

      好的,我知道了

      官方微信

      聯系我們

      • QQ:33143335 QQ:1904200230
      • 電話:18569912460
      • 投稿:cndesign@163.com
      • 地址:鄭州市國家大學科技園東區(qū)9號樓2層

      版權信息

        移動 Android 版 豫 ICP 備16038122號-2 豫公網安備 41019702002261號

      主站蜘蛛池模板: 日韩AV无码一区二区三区不卡毛片| 国产精品99无码一区二区| 激情爆乳一区二区三区| 亚洲.国产.欧美一区二区三区 | 国产情侣一区二区三区| 无码少妇一区二区三区| 国产成人精品一区二三区 | 亚洲欧美日韩一区二区三区在线| 亚洲色偷精品一区二区三区| 日本一区二区三区在线观看视频 | 影院成人区精品一区二区婷婷丽春院影视 | 亚洲一区中文字幕| 亚洲一区二区三区国产精品| 亚洲综合色一区二区三区| 亚洲AV无码一区二区三区DV | 日韩精品无码Av一区二区| 午夜福利av无码一区二区| 日韩十八禁一区二区久久| 国产精品一区二区资源| 国内精品一区二区三区东京| 久久精品国产一区二区三| 亚洲乱码国产一区三区| 波多野结衣高清一区二区三区| 精彩视频一区二区| 久久久久久人妻一区二区三区| AA区一区二区三无码精片| 中文字幕一区一区三区| 日韩亚洲AV无码一区二区不卡 | 美女免费视频一区二区三区| 国产人妖视频一区二区破除| 无码人妻久久一区二区三区免费丨| 乱色精品无码一区二区国产盗| 国产视频一区二区在线播放| 久久亚洲中文字幕精品一区| 波多野结衣高清一区二区三区| 伊人激情AV一区二区三区| 国产波霸爆乳一区二区| 福利一区二区视频| 国产日韩精品一区二区三区| 日韩高清一区二区三区不卡| 日韩一区二区三区免费播放|