工業人機界面簡稱HMI，又稱觸摸屏監控器，是一種智能化操作控制顯示裝置，HMI的主要功能有：數據的輸入與顯示；系統或設備的操作狀態方面的實時信息顯示；在HMI上設置觸摸控件可把HMI作為操作面板進行控制操作；報警處理及打印；此外，新一代工業人機界面還具有簡單的編程、對輸入的數據進行處理、數據登錄及配方等智能化控制功能，在設計人機界面的時候應該注意以下幾點。

@董弈 ：列表算是一個非?；A的設計元素，無非是一排一排的數據內容，加上一些基本的操作。最近連續設計了一個禮拜的列表后，最直觀的感受是：再簡單的東西，也有很多的細節需要思考。尤其對于很多數據產品和工具型產品，列表是非常重要的一部分，例如電子郵箱，文件系統（Google drive, dropbox)。一個信息結構合理，操作明確表格、列表設計，能夠幫助用戶減輕很多的閱讀負擔。這篇文章會分享一些列表設計中的基本思路。

隨著信息和技術的發展，手機屏幕越來越大，界面開始承載越來越多的信息，繁復的界面裝飾細節，讓界面顯得越發臃腫，人們開始更多的關注界面的內容和功能，信息框架呈現出扁平化的趨勢，在設計風格上，設計師們也不再追求3d、擬物化的設計，而是越來越崇尚扁平、簡約的設計理念。

版面的構成是信息傳播的橋梁，發揮版面元素中各自的特點和功能，會使整個版面完成從視覺到內容的完善性和美觀性，從而更快、更準確的傳遞信息，所以版式設計一直以來廣泛應用在廣告、招貼、雜志等平面設計中。雖然在移動應用中是以用戶的操作和使用體驗為主，但隨著扁平化潮流襲來，我們不再通過細膩的質感和光影提升界面的品質，拉開界面的層次，那我們靠什么來吸引我們的用戶，為用戶創造良好的閱讀和使用體驗呢？

缺省頁面，是出現在用戶沒有提交任何資料或者網絡連接不通暢的情況下所展現的頁面。通常設計師們習慣用豐富的數據內容把頁面設計得美觀實用，考慮的都是界面展現的“理想狀態”，往往會忽視沒有內容的“缺省狀態”。未經過精心設計的缺省頁面降低了用戶的使用體驗，并可能給用戶帶來困擾，如下圖iOS系統郵件App，無郵件時界面上沒有任何有效反饋信息，用戶不能明確得知到底是網絡問題還是賬號同步出錯亦或者是收件箱內確實一封郵件都沒有。同樣的情況也出現在Pinterest和出發吧的界面里。

鴻影：與商業創新、技術創新、組織創新等相比，設計創新大概是很多人心目中「最沒有門檻」的一個，新穎有趣的交互模式與視覺風格，固然可以在剛推出時讓人眼前一亮，但卻非常容易被競爭對手復制，難以長期維持獨特的優勢。

設計創新就沒有壁壘可言嗎？怎樣才能做出讓競爭對手更難以復制的設計創新方案？這段時間我一直在思考這個問題，在閱讀基利等人著的《創新十型》時，從中獲得了一些啟發，在此記錄下來。

流程

流程創新涉及企業生產主要產品或服務的活動和運營，采用精益生產系統來減少浪費、降低成本的方式，是流程創新的典型案例。

在設計的時候，要記住核心內容和路徑的元素：核心內容是什么，用戶如何得到它，以及業務如何轉換？

“規劃道路的方法，是先在自然景點中設置目標點，再將這些點彼此相連形成路徑?！?——Christopher Alexander

原則上，亞歷山大的做法是以目標——即人們最終想要的東西為導向，然后將它們以最有用的方法連接在一起。

但在網頁設計中，遵循的方法通常是相反的：設計師從主頁開始設計。然后他們根據網站結構層次制定出一個導航方案，不管合適與否。但是目標（用戶正在找的主要內容，或是他們想要做的事）卻成了設計過程中被考慮的最后一件事情。

受到“交通需求線”的啟發，我們可以改善這種設計網頁的方法。使用核心-路徑這種方法，可以指導你在網站中創造最直接的路徑，以便用戶直達核心內容。

我們幾乎每天都會接觸形形色色的表單，登錄賬號、填寫信息以獲取服務、發布內容等。然而填寫表單的過程往往不是特別愉悅的，我們需要消耗時間輸入信息，點擊提交，可能還需要等待審核；尤其是碰到較為復雜、流程長的表單，如果用戶體驗較差，很容易讓人產生挫敗感，在中途選擇放棄。

那么，如何提高用戶填寫表單的效率，防止他們出錯或中途流失，提升愉悅度及轉化率呢？本文就web表單設計，總結了以下的一些方法

先忽略動效，提出幾個問題，大家可以嘗試以前面學習的經驗來思考一下。

1. List 不用圖片來代替，怎么實現？
2. 所有List內容都不一樣，怎么實現？
3.   所有List 都能保持一個統一的操作，怎么實現？
4. …… 

OK，如果僅前2個問題來說，用“笨”方法都是很簡單，到第3之后，就有點坑了，是要復制N個重復Patchs？簡直要瘋掉有木有～ 當然Origami 沒這么傻，是有專門的Patch 解決這樣的情況的，這就是今天學習的重點，Loop 系列的Patch，效果類似 Craft 的 Duplicete

JavaScript 字符串用于存儲和處理文本。因此在編寫 JS 代碼之時她總如影隨形，在你處理用戶的輸入數據的時候，在讀取或設置 DOM 對象的屬性時，在操作 Cookie 時，在轉換各種不同 Date 時，諸此等等，繁不能數；而她那滿多的 API 呵，總有些讓人不愿去記憶的沖動，既然用時常搜，倒不如爛筆頭一翻，順道也體現下博客存在的價值，由此就有了這篇紀要。

字符串截取

1. substring()

xString.substring(start,end)

substring()是最常用到的字符串截取方法，它可以接收兩個參數(參數不能為負值)，分別是要截取的開始位置和結束位置，它將返回一個新的字符串，其內容是從start處到end-1處的所有字符。若結束參數(end)省略，則表示從start位置一直截取到最后。

什么是費茲定律

要探索費茲定律的運用方式，我們首先需要了解這條定律是什么，它是怎樣誕生的。

費茲定律由俄亥俄州立大學的心理學家Paul Fitts于1954年提出，旨在為人類在電腦屏幕上點擊目標對象的行為建立模型，同時涉及到了肢體移動及鼠標行為方面的問題。

舉個栗子，設想你的注意力和鼠標指針正停留在某個網站的logo上，而你被告知要去點擊頁面中的某個按鈕，于是你需要將注意力焦點及鼠標指針都移動到那個按鈕上。這個移動過程當中的效率問題就是費茲定律所關注的。

費茲定律的原始公式是這樣的：

MT=a + b * log2(D/W + 1)

其中MT代表位移所需花費的時間，這是我們最需關注和解決的問題。a與b兩個變量代表系統方面的耗時及效率，屬于經驗參數。D代表初始位置與目標位置之間的距離，W代表目標對象的尺寸。