Google 推出 Roboto Serif 免費襯線字型,讓閱讀變得更舒適

Google 推出 Roboto Serif 免費襯線字型,讓閱讀變得更舒適

Roboto 是 Google 在 2011 年為 Android 4.0 開發的無襯線字體(Sans-Serif)家族,2014 年為新的 Android 5.0 重新設計,後來也成為 Google 旗下服務 Google Play、YouTube、Google 地圖和 Google 圖片搜尋的預設字型。Roboto 字型使用 Apache 授權條款釋出,整個字型家族包含六種字重粗細:Thin、Light、Regular、Medium、Bold、Black 和相對應的斜體,任何人都可以從 Google Fonts 網站免費下載。

CSS.GG 超過 700 個以 CSS 製作免費圖示 SVG、Figma 多種格式下載

CSS.GG 超過 700 個以 CSS 製作免費圖示 SVG、Figma 多種格式下載

CSS.GG 是一套開放原始碼、以 CSS 繪製而成的免費圖示集,收錄超過 700 個圖示圖案,提供 CSS、SVG、Figma 等多種格式,因為是以程式碼刻製,整套圖示檔案非常小(僅有 316kb),如果不想載入整套圖示集也可單獨取得特定的圖示,透過線上預覽功能調整尺寸大小、顏色等設定,亦可取得 CSS、SVG 和 TSX 程式碼。

Adobe Fonts 提供五種「文鼎中文字型」免費雲端下載,可個人和商業用途(方新書、明體、晶熙黑、魏碑、圓體)

Adobe Fonts 提供五種「文鼎中文字型」免費雲端下載,可個人和商業用途(方新書、明體、晶熙黑、魏碑、圓體)

以前有一段時間我使用台灣文鼎科技的「iFontCloud 文鼎雲字庫」網頁字型服務,因為它收錄一些自家開發設計的高品質字型,提供包括字型租賃和網頁字體服務,可將頁面中所使用的字以雲端技術套用為其他字型,使用者無需取得這些字型也能讓網頁呈現更好的效果,網頁字型技術在 Adobe Fonts(以前稱為 Typekit)和 Google Fonts 都有提供,Adobe Fonts 渲染速度和效果較好,如果你有訂閱 Creative Cloud 的話還能從網站免費取得各種字型。

Fontworks 和 Google Fonts 合作釋出八款開放原始碼免費字型下載

Fontworks 八種開放原始碼免費字型

Fontworks Inc.(フォントワークス株式会社)是一家成立於 1993 年的日本字體公司,旗下有知名的筑紫系列、UD 字體系列和 Klee(クレー)字體,經常出現在廣告和影集的標題或字幕設計,看起來很有氣質,筑紫系列和 Klee 也被內建於 Mac 作業系統。如果你想尋找好看的免費字型,日文字型對於漢字有一定程度的覆蓋,也有兼顧到英數字和符號,運用在中文上也是個不錯的選擇(取決於字型收錄漢字量多寡)。

Fontshare 高品質免費英文字型下載,可使用於個人和商業用途

Fontshare 高品質免費英文字型下載,可使用於個人和商業用途

如果不想花大筆費用購買字型授權,也不想使用 Google Fonts 提供的免費字型(和其他人重複),其實網路上也有不少開發免費字型的公司團隊,但大多數仍以英文字型為主,畢竟中文字型製作難度和成本太高,即使如此,很多設計上依然會用到英文或數字字型,還是要尋找使用起來很適切且讓人印象深刻的選擇。

Google Fonts 推出 Material Icons 免費圖示字型,收錄兩千個圖案五種樣式

Google Fonts 推出 Material Icons 免費圖示字型,收錄兩千個圖案五種樣式

五年前 Google I/O 大會 Google 釋出數百個 Material Icons 免費圖示,這些圖案不僅會應用到自家產品開發,也將它開放原始碼放到 GitHub 網站上讓使用者免費下載使用,可自由使用於個人或商業用途。時至今日已累積超過 2000 多種不同圖案,並有五種樣式可供選擇,這些圖案對於在傳達一些概念或想法上尤其重要,特別是在數位環境使用者介面更是無所不在。

IconPark 字節跳動官方免費圖示庫,1400 個 SVG、PNG 圖片格式下載

IconPark 字節跳動官方免費圖示庫,1400 個 SVG、PNG 圖片格式下載

現在很多企業公司或品牌都會將自己開發的設計素材開放出來,像是圖示集、字型或是網頁框架等等,使這些項目可以被更多人使用,或是在開源的情況下創造出更多可能性,當然一方面也能提高被看到的機會。之前介紹過「IBM Plex:IBM 設計免費字型下載,三種字體類型及風格指南」就是其中一個例子,或是 GitHub 釋出的開放原始碼免費圖示 Octicons 也是非常好用的素材庫,如果需要圖示可以直接在網路上搜尋。

Radix Icons 小型 SVG 免費圖示集,Figma、Sketch 格式下載

Radix Icons 小型 SVG 免費圖示集,Figma、Sketch 格式下載

還記得上次介紹的 System UIcons 專為系統和產品開發設計的免費圖示嗎?這類尺寸較小、精緻且適用於介面設計的圖案相當深得我心,在很多情境下可能都派得上用場,如果你覺得之前推薦的圖示集不太夠用,或者剛好缺少你需要的圖示,可以試著搜尋其他替代方案。小型圖示集選項很多,通常是開放原始碼(Open Source)且包含多種常見常用圖片格式,接下來要介紹的免費圖示包含相當豐富的圖案,需要的朋友可以研究一下。

System UIcons 專為系統和產品開發設計免費圖示集,可自由使用無限制

System UIcons 專為系統和產品開發設計免費圖示集,可自由使用無限制

雖然我沒有開發過應用程式或網路服務,但可以想見使用者介面是一個很棘手的問題,如果要讓操作上更加直覺、好用,可能得搭配上好的圖示圖案,圖案也是很重要的環節吧!雖然網路上有不少免費圖示可用,不一定符合你的介面風格,這時候越簡單越好,找個只有線條、乾淨沒有太多顏色的圖示集就是最佳選擇,以前介紹過的 BasiconsFeather IconsOcticons 或 Entypo 都是不錯的選擇。

Basicons 用於產品設計和介面開發免費圖示集,186 個基本線條圖案下載

Basicons

如果要設計產品或開發使用者介面,我們通常會需要風格相同的圖示集,若無法自行繪製或不希望付費購買也有很多替代方案,像是我個人很推薦的 Ionicons 收錄超過 700 個高品質圖示,還有 Zondicons 維持相當好的圖示設計,可整合到任何操作介面而不會看起來太過突兀或是造成使用上的障礙;Zwicon 則主打手工打造的高品質免費圖示集,看起來精緻且風格一致,能夠呈現優雅的視覺效果,使用 WordPress 的朋友可以試著以內建的 Dashicons 圖示集進行開發工作,在全新 5.5 版加入多達 71 個新圖示。