科學的研究方法步驟

1：提出問題 ? ? 2：猜想與假設 ? ? 3：制定計劃與設計實驗 ? ? 4：進行實驗與收集數據 ? ? 5：分析與論證 ? ? 6：反思與評估 ? ? 7：表達與交流

問題1? iOS與android默認字體的進化過程

三版Roboto字體對比，最新版設計變化較大。筆畫越來越流暢，風格上也來越骨干和簡約。字母和數字都非常細致的優化。

問題2 PX，DP和SP之間的關系

1PX 等于屏幕上的 1 像素

dp 在 iOS 中稱作 “點”，dp是物理單位，dp數量 X 屏幕密度 = PX數量，可以簡單理解為 “屏幕越細膩，1dp 所包含的 px 就越多”

sp 在一半情況下 1 sp = 1 dp ，但是當用戶調整過手機的默認字體大小后，采用 sp 為單位的文字會根據調整比例進行縮放。所以Android官方強烈建議APP內的字體采用 sp 為單位來保證應用的易用性

常見的設備屏幕密度

IOS：iPhone 5S ~ iPhone 7 ?2X，iPhone 6p ~ iPhone 7p ?3X，大部分的iPad ?2X

Android：hdpi設備 1.5X（代表機型為Nexus S，4英寸，分辨率為800X480），xhdpi設備 2X（代表機型為三星 Galaxy SIII，4.8英寸，分辨率為1280X720），xxhdpi設備 3X（代表機型為Nexus 5，4.95英寸，分辨率為1920X1080），xxxhdpi設備 3.5X（代表機型為Nexus 6P，5.7英寸，分辨率為2550X1440）

在調大系統字號前后，分別用字體實驗工具生成了 16sp 和 16dp 大小的字體預覽效果。從上圖可以看到采用 sp 為單位的字體，會隨著系統字體變大而變大。設計過程中，當字體采用 sp 為單位的時候，應該提前考慮到文字隨系統進行縮放之后的適配效果。

問題3 ?同樣的字號，PS和開發效果是否一樣？

這可能是大家最關心的問題。文字的效果還要進一步分解為：視覺大小、粗細、字間距以及行間距。將字體實驗工具的截圖放在PS內進行一下對比，測試設備為 nexus 5，系統版本為4.4.4，PS中所用字體為第二版Roboto和DroidSansFallback。

紅色文字是在PS里寫出來的，字號為 60px（即20dp），通過實驗可以得到如下結論：

1.? ps中的文字視覺大小和開發效果是一致的，粗細也一致。

2.? 英文Roboto字體的字間距會有一些差距，在PS中的字間距稍小。

3. 中文DroidSansFallbac字體的字間距保持一致。

4. ps的默認行間距差與開發效果差距較大，必須手動調整才能保持一致。

結論：同樣字號下，PS與開發效果幾乎保持一致，但行間距需要單獨調整。行間距會在“問題6”中進行研究。

科學的研究方法還需要我們再次驗證已發現的結論，下面是用另外一臺系統版本為6.0的nexus 5手機進行的驗證結果。

在Android 6.0系統上進行的測試，得出的結論基本與Android4.4.4系統是一致的，證明剛才的結論是正確的

問題4 探索文字的實際大小和視覺大小

下圖中“UIDesignScience訂閱號”的文字高度是紅色塊高度、藍色塊高度還是綠色塊高度，亦或是藍色塊 + 綠色塊的高度？

到底如何才能找出“文字的實際小大呢”？文字的實際大小和視覺大小到底有何區別和聯系？

現在我要大膽地提出一個猜想或者假設：文字的實際大小和視覺大小不一樣，但必然存在相關性。

問題5 如何獲取文字的真實高度和寬度

3步獲取字體大小：

1. 輸入我們需要的文字

2.設置字號和行間距

3.點擊“顯示效果”按鈕

預覽框中顯示的黑色區域就是文字實際大小占據的區域，截圖導入PS就可以量取具體數值。

獲得字體高度和寬度之后，重新輸出一下設計標注圖，如此標注，開發效果將會非常接近設計效果。

問題6 文字的“行間距”和“字間距”

先講講字間距，設計過程中，需要調整字間距的情況不是很多，常接觸的就是多行文本的首尾端對齊，看下面的例子。

我手動調整了部分文字間的字間距來獲得整齊美觀的段落對齊效果。很遺憾的是，Android系統的原生文本控件，并不支持自定義字間距，想要實現文本的首尾對齊效果必須“自定義控件”才行，因為自定義控件的編碼工作量較大，加之設計上的需求也比較少，就不多加討論了，大家只要知道：字間距自定義是可行的，只是編碼工作量較大。

Android系統的原生控件對自定義行間距的支持非常好，設計過程中調整行間距的情況也很多，因為行間距會影響到文本的閱讀感受和閱讀效率，還是先看一個例子。

不同的設計環境需要不同的行間距，有的需要高效，有的需要美觀，在上篇的問題3中提到過，PS的默認行間距和Android開發效果的行間距是不同的，不僅如此，不同的系統和不同的軟件對默認行間距的處理也不盡相同。不要擔心，通過實驗工具可以輕松獲得設計效果下的開發數值。實驗工具提供了系統的默認行間距效果頁面和自定義行間距的功能來解決各式各樣的文字排版需求。

行間距數值和行間距倍數的含義：

行間距數值（開發采用android:lineSpacingExtra定義）：表示在默認行間距的基礎上增加或者減少多少dp/sp/px，通常采用dp做單位，我也推薦采用sp做單位，正數代表增加，負數代表減少。

行間距倍數（開發采用android:lineSpacingMultiplier定義）：表示采用默認行間距的多少倍，可以使用小數，大于1代表增加，小于1代表減少。

同時應用“行間距數值”和“行間距倍數”時：總行間距 = 默認行間距 × 行間距倍數 + 行間距數值。

問題7 0.5px的文字會不會進行四舍五入？

將截圖導入PS，紅色文字是按照實驗工具中設置的字號寫的，而藍色文字則是按照四舍五入后的字號寫的，實驗結果顯示，開發效果與四舍五入后的文字效果一致。這好像是一個閑的蛋疼的問題啊~不要過早下結論，我們看一個例子來證明這個問題是非常有意義的。

下面的截圖來自nexus s（hdpi機型），它的屏幕密度為1.5x，hdpi的機器依然有較大的市場占有率，多為運營商的合約機，使用者也多是上了年紀的用戶。當我們使用了11sp、15sp和17sp的文字時，理論上應該顯示為16.5px、22.5px和25.5px的文字，因為“四舍五入”原則，實際會顯示為17px、23px和26px。不要小看多出來的0.5px，在低分辨率手機上很大程度地提高了可讀性。

我最常用的字號：

一級標題：18sp，比如新聞列表和正文頁面的標題，重文字閱讀的app應該盡量大一些。

二級標題或正文：16sp

說明性文字：14sp

注釋性文字：12sp，只用在時間戳等不太重要的地方。

如果你特別喜歡小字號：

一級標題：17sp，比如新聞列表和正文頁面的標題，重文字閱讀的app應該盡量大一些。

二級標題或正文：15sp

說明性文字：13sp

注釋性文字：11sp，只用在時間戳等不太重要的地方。

希望大家盡量采用較大一些的字號，我們有一天也會眼花的呢。另外我還喜歡用偶數字號，減少系統進行四舍五入的情況。