版面研究所⑤Banner設計學：8大關鍵要訣、6大主題應用，1秒抓住眼球，飆高人氣點擊率！：思わずクリックしたくなる バナーデザインのきほん

◆前言
◆本書使用方法
◆INTRODUCTION 設計前先整理！

PART1 成功的Banner該怎麼製作？
01【層次感】迅速傳遞訊息的訣竅
02【字型】提升閱讀的字型選擇訣竅
03【排版】用易懂的版面彙整資訊
04【裁切】去除多餘，襯托產品的訣竅
05【節奏感】打破單調，避免看膩的訣竅
06【配色】操縱色彩，改變氛圍的訣竅
07【視線引導】打造順暢閱讀的訣竅
08【裝飾】用素材展現出形象
◎COLUMN_進行前必須確認！按照需求製作Banner

PART2 再小也好懂的排版訣竅
01【斜向切割】分區讓人迅速看懂資訊
02【切割兩塊】遇到條列項目、縱長圖像時很方便的排版法
03【不對稱】擺脫粗糙形象的訣竅
04【自然躍動】想打造歡樂的流行動態感時
05【活用盤子】餐飲店廣告常用技巧
06【用重疊製造立體感】照片不顯眼時
07【白窗戶】趕時間時可用的排版
◎COLUMN_變身各種形狀！切割不同尺寸Banner

PART3 一眼看懂資訊的文字設計法
01【直書】賦予單調文字節奏感
02【將文字配置得有如圖像】瞬間吸引目光
03【數字要大】最王道的吸睛手法
04【斜體】展現氣勢與速度感
05【沿著曲線配置】賦予文字柔和動態感
06【用色彩分解文字】藉繽紛顏色提高設計感
07【文字描邊】即使背景紛亂，文字也易懂！
08【增加英文字】將原稿沒有的文字，當作視覺焦點加上
09【毛筆字型】營造高級感和風
10【手寫字型】博得親切感與共感
11【框線錯位文字】清新明亮的氛圍
12【造字】創造文字，賦予衝擊感
13【植入文字】無縫連接背景與文字
◎COLUMN_知道後就如有神助！超實用的5大便利網站

PART4 即使不同的資訊，也讓人更易看懂的分組術
01【鋪設色塊】更換背景讓文字更好讀！
02【對話框】簡化文字，並配置成視覺焦點
03【緞帶】輕盈優雅的裝飾
04【圖解】用視覺圖像表現順序
05【框起來】讓混在其中的文字更好理解
06【色彩反轉】雙色調也能夠詮釋奢華感
07【按鍵】讓人想「點擊」的設計
08【拱狀】詮釋祭典、活動等的熱鬧氣氛
◎COLUMN_適合不擅設計的人！用臨摹鍛鍊手感

PART5 用人臉或視線打造吸睛設計
01【臉】利用人的習性增加吸睛度
02【人的視線】運用視線方向，引人注意文字
03【團體照】配置多人情境，呈現熱鬧感
04【手勢】運用手部動作導覽
05【遮住眼睛】調整臉部避免過度搶眼
06【從孔洞中露臉】特寫人物照可以靈活配置
◎COLUMN_絕對不可以使用的人物照構圖

PART6 稍有不完美的照片，進行修正與加工
01【調亮】加亮陰影，讓整體更清爽
02【陰影和光暈】打造物件與背景間的界線
03【剪貼簿】給予活潑的可愛感
04【邊緣透明】將商品照與文字均放大至最大限度
05【鏡面反射】美容相關商品照最好用的技巧
06【筆刷】調整半調子的裁切位置
◎COLUMN_常見的Photoshop技巧

PART7 藉由裝飾與氛圍詮釋，打造出令人心動的設計
01【三角形】有型的背景裝飾
02【引號】為稍嫌不足的標題調味
03【圓】到處都能用的萬能圖形
04【圖示】用具象徵性的圖讓人直覺意會
05【美式漫畫風】POP的漫畫風就是搶眼！
06【亮晶晶圖形】用璀璨光輝瞬間吸睛
07【花】打造各式各樣的華麗感
08【獎牌】確實表現得獎經歷與實績
09【勾號】搭配條列式文字使用
10【紙花、禮炮】演繹出超High氣氛
11【熱氣】直覺傳遞熱騰騰的美味
12【和式紋樣】詮釋傳統豪華的氛圍
13【放射線】藉由線條方向將視線引導至中央
14【春】象徵新開始的季節
15【夏】繽紛且洋溢熱帶氣息
16【秋】紅葉與豐收的季節
17【冬】用聖誕節與閃耀感塑造期待感
18【新年】表現出新年的喜慶感
◎COLUMN_交稿前應檢視的項目  

◆總複習！Banner練習題
◆用關鍵色做選擇的Banner配色手帳

作者簡介



Hikaru Kato

　　1984年出生，出身於佐賀縣，現居福岡市。
　　2012年起從事網頁設計，於kanvas之名為企業製作。
　　官網，至今參與過的網站已經100個以上，半數都是從設計到HTML/CSS、CMS系統一條龍服務。
　　2020年2月起開辦網頁設計課程──網頁設計1 on 1 lesson channel，並於Twitter分享橫幅設計技巧。