UI設(shè)計(jì)師必讀的IOS 10人機(jī)界面設(shè)計(jì)指南 (一)

      作者:
      2016-07-04
      1349

      1.1 設(shè)計(jì)原則(Design Principles)

      作為一名移動(dòng)應(yīng)用設(shè)計(jì)師,意味你有機(jī)會(huì)發(fā)布一款具有殺傷力的產(chǎn)品能夠登上蘋果商店的榜首。為了實(shí)現(xiàn)這個(gè)目標(biāo),你的產(chǎn)品必須在質(zhì)量和功能上達(dá)到高標(biāo)準(zhǔn)。

      以下三大原則讓iOS系統(tǒng)有別于其它平臺(tái):

      清晰(Clarity):

      縱觀整個(gè)系統(tǒng),任何尺寸的文字都清晰易讀,圖標(biāo)精確易懂,恰當(dāng)且微妙的修飾,聚焦于功能,一切設(shè)計(jì)由功能而驅(qū)動(dòng)。留白、顏色、字體、圖形以及其它界面元素能夠巧妙地突出重點(diǎn)內(nèi)容并且表達(dá)可交互性。

      遵從(Deference):

      流暢的動(dòng)效和清爽美觀的界面有助于用戶理解內(nèi)容并與之交互,而不會(huì)干擾用戶。當(dāng)前內(nèi)容占據(jù)整屏?xí)r,半透明和模糊處理能夠暗示其它更多的內(nèi)容。減少使用邊框、漸變和陰影讓界面盡可能地輕量化,從而突出內(nèi)容。

      深度(Depth):

      清楚的視覺層和生動(dòng)的動(dòng)效表達(dá)了層次結(jié)構(gòu),賦予了活力,并有助于理解。

      易于發(fā)現(xiàn)的且可觸發(fā)的界面元素能提升體驗(yàn)愉悅感,讓用戶在成功觸發(fā)相應(yīng)功能或者獲得更多內(nèi)容的同時(shí)還能掌控當(dāng)前位置的來龍去脈。當(dāng)用戶瀏覽內(nèi)容時(shí),流暢的過渡提供一種縱深感。

      要想擴(kuò)大影響力和涉及范圍,在設(shè)計(jì)你的獨(dú)特應(yīng)用時(shí),請(qǐng)熟記以下幾點(diǎn)原則:

      美學(xué)完整性(Aesthetic Integrity)

      美學(xué)完整性代表了一款應(yīng)用的視覺表象和交互行為與其功能整合的優(yōu)良程度。例如,一款協(xié)助用戶完成重要任務(wù)的應(yīng)用應(yīng)該使用不易察覺且不引人注目的圖形、標(biāo)準(zhǔn)化控件和可預(yù)知的交互行為從而讓用戶保持專注。反之而言,一款沉浸式體驗(yàn)的應(yīng)用(比如游戲),就需要吸引人的視覺表象,在鼓勵(lì)用戶探索的同時(shí)帶來無窮的樂趣和刺激。

      一致性(Consistency)

      一款內(nèi)部一致的應(yīng)用能夠貫徹相同的標(biāo)準(zhǔn)和規(guī)范:使用系統(tǒng)提供的界面元素、風(fēng)格統(tǒng)一(眾所周知)的圖標(biāo)、標(biāo)準(zhǔn)的字體樣式和一致的措辭。應(yīng)用所包含的特征和交互行為是符合用戶心理預(yù)期的。

      直接操作(Direct Manipulation)

      對(duì)屏幕上的對(duì)象直接操作(而不是通過一堆控件)能夠提升用戶的參與度并有助于理解。直接操作指包括用戶旋轉(zhuǎn)設(shè)備或者使用手勢(shì)控制屏幕上的對(duì)象。通過直接操作,他們的交互行為能夠得到即時(shí)可視的反饋。

      反饋(Feedback)

      反饋認(rèn)證交互行為,呈現(xiàn)結(jié)果,并通知用戶。系統(tǒng)自帶的iOS應(yīng)用對(duì)每一個(gè)用戶行為都提供了明確的反饋。可交互的元素被點(diǎn)擊時(shí)會(huì)被臨時(shí)高亮,進(jìn)度指示器(progress indicator)顯示了需要長時(shí)間運(yùn)轉(zhuǎn)的操作的進(jìn)度,動(dòng)效和聲音加強(qiáng)了對(duì)行為結(jié)果的提示。

      隱喻(Metaphors)

      當(dāng)一個(gè)應(yīng)用的虛擬對(duì)象和行為與用戶熟悉的體驗(yàn)相似時(shí)——無論這種體驗(yàn)是來源于現(xiàn)實(shí)生活或是數(shù)字世界,用戶就能更快速地學(xué)會(huì)使這款應(yīng)用。隱喻在iOS中能夠起作用是因?yàn)橛脩襞c屏幕進(jìn)行物理上的交互。他們通過將視圖移出屏幕來顯示下方的內(nèi)容,他們拖曳(drag)和滑動(dòng)(swipe)對(duì)象,他們撥動(dòng)(toggle)開關(guān),移動(dòng)(move)滑塊,滾動(dòng)(scroll)數(shù)值選擇器,他們甚至通過輕掃(flick)來翻閱書籍和雜志。

      用戶控制(User control)

      在iOS內(nèi)部,是用戶——而不是應(yīng)用——在控制。應(yīng)用可以對(duì)一系列用戶行為提供建議,或?qū)赡茉斐蓢?yán)重后果的行為發(fā)出警告,但不應(yīng)該替用戶做決定。好的應(yīng)用會(huì)在讓用戶主導(dǎo)和避免不想要的結(jié)果中找到平衡。為了讓用戶感覺到是他們?cè)诳刂疲瑧?yīng)用應(yīng)該使用熟悉且可預(yù)知的交互元素,讓用戶二次確定有破壞性的行為,并且讓即使在運(yùn)行中的操作也能夠被輕易取消。

      1.2 iOS 10 新特征介紹

      在iOS 10,你可以創(chuàng)造前所未有的更強(qiáng)大的應(yīng)用。當(dāng)你瀏覽這些新改變并在思考他們將如何幫助你的應(yīng)用時(shí),請(qǐng)?zhí)貏e關(guān)注設(shè)計(jì)指南。

      1.jpg

      搜索屏幕和主屏幕的窗口控件(widget)

      Widget 提供即時(shí)且有用的信息,或是應(yīng)用特有的一些無需打開應(yīng)有就能使用的功能。在過去,用戶在消息中心添加widgets當(dāng)作快速入口。現(xiàn)在,用戶在搜索屏幕添加widgets,用戶可通過在主屏或是鎖屏右滑進(jìn)入搜索屏幕。你也可以在主屏通過3D Touch觸發(fā)的某個(gè)應(yīng)用的快捷操作菜單(quick action list)上方添加widget。Widget的設(shè)計(jì)和交互方式也改變了。請(qǐng)注意更新你現(xiàn)有的設(shè)計(jì)。

      2.jpg

      與Messages的聯(lián)動(dòng)

      應(yīng)用可以通過執(zhí)行一種出現(xiàn)在對(duì)話下方的messaging插件讓用戶與朋友分享來自該應(yīng)用的內(nèi)容。應(yīng)用可以通過Message分享文字,圖片,視頻,貼紙,甚至可交互的內(nèi)容,譬如信息內(nèi)的游戲。

      3 .jpg

      與Siri的聯(lián)動(dòng)

      應(yīng)用能夠與Siri聯(lián)動(dòng),從而讓用戶使用聲音來執(zhí)行相應(yīng)的應(yīng)用操作,譬如打電話、發(fā)短信和開始鍛煉。

      4.jpg

      可拓展的通知欄

      你可以通過拓展詳情視圖來強(qiáng)化你的通知欄,用戶可以在未鎖屏狀態(tài)下通過3D Touch功能點(diǎn)擊或是下滑你的通知來打開拓展視圖。使用這種視圖能夠讓用戶快速瀏覽更多信息,并允許他們?cè)诓浑x開當(dāng)前界面的情況下對(duì)該消息進(jìn)行快速操作。

      1.3 界面基本元素

      大多數(shù)的iOS應(yīng)用使用了來自UIKit的部件,這是一個(gè)定義了基本界面元素的編程框架。這個(gè)框架讓各種應(yīng)用在視覺上達(dá)到一致的同時(shí)還提供了高度的個(gè)性化。UIKit元素是靈活且常見的。它們是可適配的,讓你能夠設(shè)計(jì)一個(gè)在任何iOS設(shè)備上都看起來很棒的應(yīng)用,而且能夠在系統(tǒng)發(fā)布新版本的時(shí)候自動(dòng)更新。由UIKit提供的界面元素可以分為以下三種:

      欄:

      告知用戶現(xiàn)在在應(yīng)用的哪里,提供導(dǎo)航,而且還可能包含按鈕或者其它用來觸發(fā)功能和交流信息的元素。

      視圖:

      包含用戶在應(yīng)用內(nèi)最關(guān)注的信息,例如文本、圖形、動(dòng)畫和交互元素。視圖允例如滾動(dòng)、插入、刪除和排列之類的行為。

      控件:

      觸發(fā)功能和傳遞信息。控件包括按鈕、開關(guān)、輸入框和進(jìn)度指示器。

      為了進(jìn)一步定義iOS界面,UIKit規(guī)定了你的應(yīng)用能夠采用的功能。通過這個(gè)框架,你的應(yīng)用可以對(duì)觸摸屏上的手勢(shì)作出應(yīng)答,還可以包含一些例如繪畫、輔助和打印的功能。

      iOS也和其他編程框架和技術(shù)緊密結(jié)合,譬如Apple Pay、HealthKit 和ResearcKit, 它幫助你設(shè)計(jì)出一個(gè)強(qiáng)大地驚人的應(yīng)用。


      0
      2
      分享到:

      0

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

      推薦閱讀

      ×

      賽事服務(wù)聯(lián)系方式

      0371-86068866

      4008887269

      cndesign@163.com

      好的,我知道了

      官方微信

      聯(lián)系我們

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

      版權(quán)信息

        移動(dòng) Android 版 豫 ICP 備16038122號(hào)-2 豫公網(wǎng)安備 41019702002261號(hào)

      主站蜘蛛池模板: 日韩一区二区在线免费观看| 亚洲AV日韩综合一区尤物| 亚洲丰满熟女一区二区v| 国产一区二区免费| 亚洲AV无码一区东京热| 人妻少妇久久中文字幕一区二区 | 蜜桃无码AV一区二区| 日本一区二区三区免费高清| 动漫精品专区一区二区三区不卡| 国产99久久精品一区二区| 日韩精品一区二区三区老鸭窝 | 亚洲AV成人精品日韩一区| 国产一区二区在线视频播放| 视频一区二区在线观看| 亚洲综合无码一区二区| 国产在线步兵一区二区三区| 超清无码一区二区三区| 亚洲AV无码一区二区三区人| 高清一区高清二区视频| 91在线精品亚洲一区二区| 濑亚美莉在线视频一区| 日韩内射美女人妻一区二区三区| 波多野结衣电影区一区二区三区 | 在线观看精品一区| 国产福利电影一区二区三区久久久久成人精品综合 | 国产日韩精品视频一区二区三区| 美女福利视频一区二区| 亚洲国产av一区二区三区丶| 国产伦精品一区二区三区免.费| 亚洲av乱码一区二区三区| 精品视频在线观看你懂的一区| 精品人妻中文av一区二区三区| 精品一区中文字幕| 亚洲一区二区三区写真 | 国产精品制服丝袜一区| 亚洲一区二区三区在线观看蜜桃| 在线观看午夜亚洲一区| 国精产品一区二区三区糖心| 91国在线啪精品一区| 国产高清不卡一区二区| 狠狠色成人一区二区三区|