軟件界面設計復習文檔

人機界面、用戶界面、軟件界面、UI界面、web界面、app界面的概念。軟件界面：軟件中面向操作者而專門設計的用于操作者使用及反饋信息的指令部分。用戶界面：軟件的人際交互、操作邏輯、界面美觀的整體設計。UI界面：用戶的操作界面，UI主要指界面的樣式、美觀程度。人機界面：是人與計算機之間傳遞、交換信息的媒介或對訪接口，是計算機系統(tǒng)的重要組成部分。web界面：可以在瀏覽器下看到的軟件界面。APP界面：手機的分辨率合手機的大小尺寸。了解軟件界面設計的過程。功能性需求搜集；用戶分析；信息構建；原型；可用性測試；圖形界面設計。為什么要進行用戶調研？可以通過哪些方法進行調研？‘用戶調研的目的是為人機交互系統(tǒng)的分析、設計提供數(shù)據(jù)，使設計出的人際交互系統(tǒng)更適于各類用戶的使用。調研方式：工作觀察和情景訪談調查問卷用戶模型/人物角色焦點小組/焦點團體/焦點群眾。用戶的行為模式有哪些？安全探索、及時滿足、滿意即可、中途變卦、延后選擇、遞增構建、習慣、小片時間、空間記憶、前瞻記憶、簡化重復工作、只支持鍵盤、旁人建議、個性化推薦掌握信息架構的概念作用以及信息架構的方式。概念：是在信息環(huán)境中、影響系統(tǒng)組織、導覽及分類標簽的組合結構，這是將架構和設計學運用在數(shù)位環(huán)境中的一門學問。作用：滿足用戶需求、滿足從產品目標方式：架構設計決定組織方式歸類信息架構受到哪些因素的影響。用戶層面的考慮：用戶的理解能力，用戶的熟悉程度，目標內容的使用頻率產品層面的考慮：產品你的核心價值，產品的主線功能好的信息架構具備的特點。與產品目標和用戶需求相對應具有一定的延展性保證分類的標準的一致性，相關性和獨立性有效的平衡信息架構的“廣度”，“深度”使用用戶語言，同時避免語義歧義或不解。掌握信息架構中相關的設計模式以及特點。主題、搜索、瀏覽模式新聞流圖片管理器信息板多級幫助向導設置編輯器可選視圖多工作空間畫布加調色板工具掌握內容導航設計中的相關模式以及特點。A：按內容組織導航：1.菜單(主導航）【菜單常用做網站的主導航，一般位于網站上方，用戶可以從主導航找到目標內容。一般由超文本組成的一行鏈接。如/】。一般大量用在網站首頁； 2.目錄導航；【通常位于處理沒有層級關系的信息，網頁目錄通常按主題類別提供網頁的鏈接。類別的標題通常按照字母順序排列，主要標題經常以較大字體顯示，次要標題鏈接位于下方，如果網站提供相當數(shù)量的內容或服務，而這些內容和服務之間不存在直接聯(lián)系，大部分內容都屬于并列關系。而整理出它們之間的關系是很難的事情】3.網站地圖：【它概括了整個網站的結構，并提供給用戶自上而下的導航途徑，使用網站地圖，用戶可以直接跳轉到地圖列出的任意頁面。可以采用不同的顏色來表示不同的網站區(qū)域。與目錄導航不同的是，網站地圖提供的是一個完整的層次結構，而不是某個分類目錄】B：路徑導航：面包屑導航；分步導航；分頁導航；樹狀導航；滾動列表；圖標導航；C：預覽式導航（圖像導航）：內容預覽導航；自動翻頁；D：地圖導航：頁面布局的概念以及進行頁面布局的方法。概念：對頁面元素進行規(guī)劃、組織、排版方法：合理的視覺層次合理的視覺流掌握視覺層次的概念以及構建出合理的視覺層次的方法。概念：對用戶掃描頁面的時候能夠進行視線跟蹤作用：跟蹤讀者視線正確的次序掃描引導視線視覺流的概念以及視覺流的作用。概念：在二維平面上利用顏色的變化、符號的大小，線劃的粗細對視覺的不同刺激而產生的遠近不同層次的視覺效果作用：看出該頁面所要表達的信息結構呈現(xiàn)各項頁面的相對重要性以及之間的關系創(chuàng)建良好視覺流的方法。大?。狠^大的物體具有更大的吸引力、最小的元素因該是最不重要的。顏色：醒目，強烈對比的顏色，體現(xiàn)個性、更精煉的層次感、感情上的吸引力對齊：體現(xiàn)出元素的組織以及元素之間的關系緊密與留白：整體感、將元素彼此分開并且創(chuàng)建下級的層次。掌握格式塔原則以及格式塔的作用。原則：行不止于一般的形狀，還包括由知覺活動組織成的經驗中的整體，中文又譯作“完形”。他認為整體決定部分的性質，，而部分依從于整體。作用：指導如何在有限的空間里向用戶傳達更加豐富的信息；幫助設計師去設計一個架構或頁面內的從屬關系，還可以設計頁面中需要用戶特別注意到的模塊元素，制造一些具有深刻印象的平衡和牢固；讓用戶更輕易的解讀界面。掌握頁面布局的相關模式以及模式特點。模式：1.視覺框架2.中央舞臺3.對等網格4.帶標題的區(qū)域5.模態(tài)Tab6.手風可收起面板8.可移動的面板9.右/左對齊10.對角線平衡11.響應式展開12.響應式允許13.流體布局A:視覺框架的模式特點：使用相同的基本布局、顏色、格式方案設計頁面，但是會讓設計足夠靈活來處理不同的頁面內容B：中央舞臺模式特點：最重要的UI部分在頁面或窗口占據(jù)最大的尺寸。輔助工具和內容放在周圍的小面板上C：對等網格模式特點：以網格或矩陣的方式排列內容元素；每個元素使用相同的模板；每個元素的視覺重量相仿D：帶標題的區(qū)域模式特點：一個頁面或窗口要顯示的信息不止一個或可以劃分成幾個部分。給每個部分一個醒目的標題；給每個部分進行視覺上的區(qū)分。每個部分都排列在頁面或窗口。E:模態(tài)tab模式特點：將內容的不同模塊組織成一個小型的Tab，這樣可以每次只看到一個模塊。用戶單擊Tab來查看不同的模塊內容F：手風琴模式特點：將不同的內容模塊放到一組順序排列的面板中。這些面板每一個都可以關閉、打開，互不干擾G：可收起面板模式特點：將次要內容和可選內容放到用戶能自己打開、自己收起的面板里。H：可移動面板模式特點：將頁面上的內容模塊組織到幾個不同的區(qū)塊里，每一個都可以獨立打開或關閉。用戶可以隨意在界面上放置這些模塊，也可以移動它們。I：左右對齊模式特點：在設計一個兩欄的表單或表格時，讓左邊的標簽右對齊，右邊的元素左對齊；J：對角線平衡模式特點：用一種不對稱的方式布置頁面。通過將視覺重量放在頁面左上角和右下角來使頁面保持平衡。K：響應式展開模式特點：通過用戶的具體操作，逐步顯示更多的界面，來引導用戶完成一系列步驟。L：響應式允許模式特點：頁面初始展示時，頁面上的大部分元素是不能操作的，隨著用戶的動作，逐步允許用戶操作這些元素。M：流體布局模式特點：當用戶調整窗口大小時，相應的調整頁面元素的大小和位置，讓頁面一直保持填滿的狀態(tài)。列表的使用場景、信息架構、解決方案。列表的使用場景：獲取概覽；逐項瀏覽；查找特定列表；排序或過濾；重新安排、添加和刪除或重新分類列表項列表信息架構：長度；分組；列表項類型；交互；動態(tài)行為解決方案：當用戶從列表中選擇一項時，應該如何顯示該項的細節(jié)信息；如何顯示有太多圖像的信息列表；如何管理一個非常長的列表；如何顯示一個分類或層級進行組織的列表。掌握列表中相關的設計模式以及各個模式的相關特點。雙面板模式的特點：在界面中放置兩個并列的面板，在一側的面板中顯示用戶可以進行選擇的列表，在另一側的面板中顯示被選擇的內容單窗口深入的特點：在一個獨立的窗口中顯示一個列表或列表項的菜單，當用戶從列表中選擇一個列表項時，在該窗口中顯示信息或內容，替換整個列表列表嵌入的特點：將列表在一個縱欄中以多行的形式顯示。當用戶選擇某一項時，就在列表中打開該項的細節(jié)信息。允許各個列表項可以獨立的打開和關閉?？s略圖網格的特點：將由吸引人的圖形化對象組成的列表放入一個由縮略圖組成的“小型多行”網格中，用戶可以選擇一個或多個縮略圖來查看或管理這些列表項傳送帶的特點：將由吸引人的圖形化對象組成的列表放入一個水平放置的帶狀或拱形區(qū)域中，并允許用戶向前/向后滾動或甩動圖片縮略圖來查看他們?？梢苑糯笪挥谥醒氲牧斜眄棥７猪摰奶攸c：采用分頁的形式將一個長列表進行分割，每次只加載一個頁面。為用戶提供訪問整個的導航—下一頁、前一頁、首頁和末頁條目跳轉的特點：當用戶鍵入列表項的名字時，在表格或者樹中直接跳轉到對應的列表項并選中該項。字母表滾動的特點：在一個以字母表排序的列表中沿著滾動條顯示字母隊列。級聯(lián)列表的特點：通過在每一個層級中顯示可供選擇的列表項來表示一個多層級結構。樹表的特點:將列表項的分類字段按表格的列進行放置，在第一列中用逐漸大綱的形式來展示樹形結構。斑馬行新列表行掌握動作與命令中的相關設計模式與特點。模式及特點：按鈕組的特點：將相關的動作組織成一組按鈕，彼此水平或垂直對齊，并采用相似的視覺設計，如果動作超過三個或四個，可以多分幾組懸浮工具的特點：緊挨著對象放置可對該對象執(zhí)行操作的按鈕和其他動作，但在鼠標沒有掠過對象之前不要顯示它們。動作面板的特點：不是使用菜單，而是在一個UI面板上采用華麗的組織方式來顯示一組相關的動作，并且總是可見的。突出‘完成’按鈕的特點：把完成一項事務的按鈕放在視覺流的末尾，加大尺寸并為它提供一個合適的標簽。智能菜單項的特點：動態(tài)改變菜單的標簽，以便適時地在調用之前顯示其功能。預覽的特點：在用戶執(zhí)行某個動作之前，為其顯示執(zhí)行結果的預覽或結果。進度提示的特點：需要很長時間才能完成的操作中為用戶顯示該操作當前的進度?？扇∠缘奶攸c：提供某種方式快速取消一個耗時的操作，而沒有什么負面的影響。多級撤銷的特點：提供一種方式可以很容易撤銷用戶所撤銷用戶所執(zhí)行的一系列操作。命令歷史的特點：當用戶執(zhí)行一系列冗長而復雜的操作時，不管是用圖形界面還是命令行的方式，希望有一個效率較高的界面支持這種時間很長而且經常重復的工作宏的特點：使用宏命令可以幫助用戶加快工作，通過減少命令個數(shù)和需要進行的動作來完成某項任務，減少了手指滑動、疏忽、遺漏，以及類似的錯誤。信息圖形的概念。是指數(shù)據(jù)、信息或知識的可視化表現(xiàn)形式信息圖形的意義。主要應用于必須要有一個清楚準確的解釋或表達復雜且大量的信息；“信息圖形”是一個很大的范圍，包括各種各樣的圖表、圖形、地圖、表格、樹狀圖、時間線、以及示意圖；數(shù)據(jù)可能很多，或者很少、很集中。創(chuàng)建良好的信息圖形交互的方式以及意義。方式：組織模型，前攝變量，導航與瀏覽，排序和重新排序，搜索和過濾，實際數(shù)據(jù)。意義：組織數(shù)據(jù)，直觀展示數(shù)據(jù)和數(shù)據(jù)間的關系，讓用戶能夠進一步了解這些數(shù)據(jù)。掌握信息圖形中的相關設計模式以及特點。總覽加細節(jié)的特點：在放大的詳細視圖旁邊放置一個總覽圖。當用戶在總覽圖上圈出一個視野的時候，詳細視圖里將顯示該視野范圍里的內容。數(shù)據(jù)提示的特點：當鼠標滑過圖形上一個興趣點時，把該點的數(shù)據(jù)顯示在一個工具提示或其他某種浮動的窗口上。數(shù)據(jù)焦點的特點：當鼠標掠過圖表上的興趣點時，高亮數(shù)據(jù)的切片并模糊其他剩余的數(shù)據(jù)。徑向表的特點：將表格或列顯示為一個圓形而不是一個行列方陣。在數(shù)據(jù)項之間畫出經過圓形內部的連線。多Y值圖的特點：把多個圖表的線段堆積起來，一個接一個地從上到下擺放在相同的面板里，讓它們共享一個x軸。動態(tài)查詢的特點：即時和交互地提供過濾數(shù)據(jù)集的方式。采用容易使用的標準控件，比如滑塊和復選框來定義數(shù)據(jù)要顯示的范圍。只要用戶調整了這些控件的值，顯示結果也立即隨之調整。數(shù)據(jù)刷的特點：讓用戶在一個視圖里選擇數(shù)據(jù)，然后在另一個視圖里同步顯示這些選中的數(shù)據(jù)。局部縮放的特點：在一個密集的頁面上顯示所有數(shù)據(jù)，其中有很多個小的數(shù)據(jù)項。當鼠標移動時，頁面會局部變形，鼠標位置的數(shù)據(jù)項會變大，變得可以閱讀。多個小圖像的特點：用兩三個維度創(chuàng)建很多小的數(shù)據(jù)圖片，并按一到兩個額外的數(shù)據(jù)維度平鋪到整個頁面，要么平鋪成連環(huán)畫式的長條，要么平鋪成二維矩陣。樹狀地圖的特點：用不同大小的矩形來表示多維數(shù)據(jù)和層級結構的數(shù)據(jù)?？梢园堰@些矩形級聯(lián)起來顯示其層次結構，并用不同的顏色或給他們加上標簽來顯示更多的變量?？膳判虮砀竦奶攸c：在一個表格里顯示數(shù)據(jù)，并讓用戶根據(jù)表格列的內容對表格進行排序。表單設計中控件的選擇時應該注意的問題。可用的空間用戶的電腦使用經驗用戶的領域經驗來自其他應用的期望可用的技術（HTMLGUI工具箱）表單輸入中常用的控件類型。列表項、文本數(shù)字日期和時間表單與控件中相關的設計模式以及特點。容錯格式:允許用戶以多種格式和語法輸入文本，并使用應用智能地解釋這些輸入。結構化的格式:它使用一組文本輸入框來反應所請求數(shù)據(jù)的格式。填空:它把一個或多個字段設置成短句或短語的形式，并將這些字段變成需要用戶填寫的“空格”。輸入提示:它在空白的文本框旁邊或下面，用一句話或一個例子來解釋需要輸入什么樣的數(shù)據(jù)。輸入提醒:用提示信息預先填寫文本框或下拉列表，來告訴用戶該怎么做或怎么輸入。密碼強度設計:當用戶鍵入時，為用戶提供關于新口令強度和有效性的即時反饋。自動完成:當用戶在文本框輸入時，猜測可能的答案、顯示可選列表，并在合適的時候自動把答案寫到輸入框里。下拉選擇器:通過使用下拉列表或彈出面板,把菜單概念擴展成一個包含更加復雜選擇的界面。列表構造器:在同一個頁面上顯示“源”列表和“目的”列表，讓用戶使用按鈕或通過拖拽在他們之間移動項目。良好的默認值:只要合適，就在表單域中預先為用戶填寫你認為他們想要輸入的值。同頁錯誤信息:通把表單的錯誤信息和表單放在一起，在頁面頂部放置錯誤信息，如果可能的話，在產生錯誤的旁邊的也進行提示。移動界面設計和web界面設計的異同點。交互方式的不同界面尺寸的不同使用環(huán)境的不同網絡環(huán)境的不同通知方式不同移動界面常用的輸入方式。鍵盤輸入（T9輸入法軟件盤）筆輸入語音識別移動界面設計中需要注意哪些問題。小屏幕尺寸可變的屏幕寬度觸屏文本輸入困難復雜的使用環(huán)境社會因素影響和有限的注意力如何進行移動界面設計。用戶在使用移動設備時的真正需求是什么精簡網站，只保留最基本的內容盡可能的使用移動設備硬件功能把內容線性化優(yōu)化最常用的交互序列移動界面設計中的相關設計模式以及特點?？v向堆疊:將移動版頁面的內容豎直線性排列，盡量不要讓內容橫向并排，使頁面內容延伸到移動設備屏幕底邊之下。小圖片加文字的列表:將呈現(xiàn)可選擇的條目列表，每個條目包含一個縮略圖、一些文