日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包

日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包

嗨,大家好,我是 applemint 的 Joyce。

各位從事網站設計的設計師們是不是常為了讓網站更有日系感而絞盡腦汁呢?常常想著,如果有現成的設計素材可運用,日系網站就不會這麼難製作?

applemint 是間台日混血的數位行銷公司,曾為許多在台的日系企業執行網站設計專案。之前 J 編曾跟大家分享,只要掌握字型、顏色、背景紋樣 3 要素,就能讓網站設計瞬間增添日系感。
那這些設計要素的素材又可以從何取得呢?

這篇文章就要寫給那些正在苦惱怎麼做出日系網站的設計師們,跟大家分享 applemint 日本設計師愛用推薦的免費日系設計素材網站。

More to read
日本設計師都在用!網頁設計商用免費素材 8 選 in 日本設計師都在用!網頁設計商用免費素材 8 選

想要做出吸睛的網頁設計或網路廣告設計,擁有合適的照片素材非常重要。幫大家整理了更多主題的無版權免費可商用設計素材網站,讓每位網頁設計師或網路廣告設計師都能更有效率地找到需要的設計素材,減少設計作業時間。

More to read
質感日文網站

日系網站製作時的範例網站,透過觀不同人所創作的網站來激發設計靈感,打造出屬於自己的日系質感網站。

免費日系字型素材推薦

網站中的文字不僅僅是傳遞資訊,若善用字型,除了能提高適閱性,還能帶出網站的整體風格,具有畫龍點睛功效。

以下精選 3 類型可商用、個人使用的免費和風字型,讓設計師們可針對想呈現的設計氛圍選擇使用。
雖是日文字型,但因支援日文漢字,因此能打出多數的繁體字,設計師們可多多利用。

1)經典氣質系

こころ明朝體 下載

投影片1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

幻ノにじみ明朝 下載

投影片3 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Font Free

なごみ極細黑體 下載

投影片2 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

2)可愛手寫系

筆記體 下載

投影片4 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

takumi書痙體 下載

投影片5 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

しろくまフォント(白熊體) 下載

投影片6 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

じゆうちょう體 下載

投影片7 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

3)復古懷舊系

飴鞭黑體 下載

投影片8 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

刻明朝體 下載

投影片9 2 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

廻想体 下載

投影片10 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

ロンドB體 下載

投影片11 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

チェックポイント 下載

投影片12 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Workship Magazine

免費日系配色辭典推薦

色彩能夠營造氛圍,選對色彩與配色能讓整體視覺感受更加強烈。
日本擁有深厚的文化底蘊,那些常被用在傳統服飾、藝術、工藝、食物、文學作品中的色彩,也被提取出來發展成一套「日本傳統色」。

以下則是 applemint 日本設計師在尋找日系配色靈感時,常用的 3 個網站資源,提供給各位設計師們參考。

1)和色大辭典(Check

和色大辭典網站收錄日本傳統 465 種顏色的參考色票,除了基本 CMYK、RGB 外,也有網頁專用 16 進位色碼可參考。
點選想要的顏色後,還有屬於該色的配色方案可參考,相當實用。

投影片27 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:日本の伝統色 和色大辞典
投影片13 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:日本の伝統色 和色大辞典

2)NIPPON COLORS 日本傳統色(Check

NIPPON COLORS 網站,集合了日本傳統 250 種用色,同樣提供CMYK、RGB與網頁 16 進位色碼。
設計師可透過色彩的點選更換背景色,並查看該顏色與其他色彩搭配的感受,作爲和風配色的參考。

文章用圖191231 2 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:NIPPON COLORS

3)Pinterst(Check

Pinterst 是一個以圖片分享為主的社群網站,許多人會在上面製作不同主題,並蒐集與主題相關的圖片。
因此,透過搜尋「和 配色」,即可找到許多和風配色相關的圖片可參考。

投影片14 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Pinterst

免費日系圖片素材推薦

除了上述的字型、色彩、背景外,設計師也可以透過具象的圖片素材來呈現日式和風感。
像是具有日系風格的插畫、採用日本 model、甚至是直接使用日本當地特色景點、建築等來讓整體日式和風感覺更加強烈。

1)日系插畫

イラストAC(Check

イラストAC 是日本知名插畫設計素材圖庫,裡頭有超過 100 萬幅向量插畫素材(AI・EPS 形式)。只要註冊登入即可免費下載,且可商用、再次編輯。

投影片15 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:イラストAC

irasutoya(Check

此網站提供的為同一作者插畫作品,走的是日式可愛手繪風格,主題遍及人物、建築、運動…等相當多元豐富。
雖然僅提供去背的 PNG 形式檔案,但不須註冊即可免費下載圖片,且同樣可再次編輯使用。

文章用圖191231 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:irasutoya

2)日系照片

写真AC(Check

提供近 200 萬張免費高清圖像素材,同樣透過註冊及即可免費下載照片,也能用於商業用途。

文章用圖191231 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:写真AC

BEIZ images(Check

在此網站中的「和風」主題內提供春夏秋冬和風照片,與松竹的和風背景,與各種具有日本季節色彩的和風照片。不須註冊即可下載,並自由運用於網站、背景、動畫…等商業設計中。

投影片16 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:BEIZ images

bluegreen(Check

此網站提供許多日本風景、建築、街景、海景、夜景,且在檔案名稱上標示拍攝地點區域,想要找日本特定區域景點的設計師,可透過站內搜尋功能查找合適的照片。
網站上的照片皆可免註冊直接下載,但有較詳細的規定可利用(商用網站、廣告banner、動畫、可加入文字編輯…等)、與不可利用的範圍,詳細規定設計師們務必先點此了解。

投影片17 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:bluegreen

Photock(Check

此網站目前揭載超過 6,000 張照片,數量雖然不多,但擁有許多日本知名景點照片,如富士山、晴空塔…等,其中又有將近 200 張日本夜景照片可選擇。
此外,它還提供「目錄分類」、「日本地域名分類」、「熱門關鍵字」…等查找方式,且強調網站內照片除了不可在未加工的情況下販售、發表外,其餘用途皆不限,相當便利。

投影片18 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Photock

3)日系人物

PAKUTASO(Check

PAKUTASO提供近 3 萬張照片供免費使用,其中最特別的是它有個「Model素材」分類,不僅是無人像版權的素材,且 9 成以上皆為日本Model,這對於想呈現日式和風感的網站設計師而言可說是一大資源。

投影片19 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:PAKUTASO

免費日系背景素材推薦

網站中的背景就如同壁紙裝潢一樣,用來襯托整個空間的氛圍。因此在背景中善用和風紋樣元素,即可讓網站整體的日式和風感再升級。

1)江戶紋樣(Check

日本的江戶時代,庶民百姓文化抬頭,帶動許多大眾娛樂如相撲、歌舞伎、浮世繪…等發展興盛,而由此娛樂文化中延伸出的服飾、繪畫中所使用的設計紋樣,也被保留至今。

投影片20 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Viva! Edo

2)金箔紋樣(Check

在17至19世紀的江戶時代,為鼓勵振興文藝並拓展學術,選擇以加賀藩為中心,發展眾多傳統手工藝品,金箔就是其一。
由於原料來自稀少的黃金,常被掌權者運用在建築、弓矢上彰顯權力。流傳至今成為一種古代奢華文化的象徵。

投影片21 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:illusa AC

3)四季紋樣(Check

日本四季分明的氣候造就多樣自然植物生長環境,為日本的四季增添不同的風貌,以四季自然特色為主題發展出的紋樣設計也相當多元。

投影片22 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:日本の伝統文様

4)其他日本傳統紋樣(Check

除了上述分類外,日本尚有許多源自古代生活、娛樂、宗教、建築…等文化所衍伸出的紋樣設計,也都各自代表了不同的意義,設計師們可多加使用。

投影片23 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:PATTERN TM

applemint 設計師日系素材運用作品分享

applemint 服務多個日本客戶,為了呈現客戶本身的「日本」特色,applemint 的日本設計師也嘗試在許多小細節中加入日系日系素材,讓整體日系感更加升級。

applemint 以數位行銷廣告起家,並將業務擴展至網站製作、Banner 設計。
applemint 認為一個符合趨勢潮流的網站,與具有明確目的性的 Banner 設計,能讓數位行銷廣告操作事半功倍,兩者相輔相成,方能創造最佳成效。

1)KA·RA·DA factory

投影片24 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:KA·RA·DA factory
1491de73 7e3a 4824 8952 9dbd6cda3a77 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包

在網頁內的 icon 設計中,加入日本傳統海波紋的設計元素。

2)Brand 楓月

投影片25 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包
來源:Brand 楓月
1491de73 7e3a 4824 8952 9dbd6cda3a77 1 in 日本設計師推薦!免費日系網站設計素材字型、色彩、背景圖片懶人包

為搭配 Logo 本身的日本傳統「霞」的紋樣,背景選用了和紙紋樣素材,讓整體日系感再往上堆疊。

看完以上分享與案例說明,如果您有相關需,求也認同 applemint 的理念,歡迎由此來訊與我們聯繫。

從這裡聯絡 applemint!

Joyce

相關文章

與我們聯繫