作者簡介
HikaruKato1984年出生,出身於佐賀縣,現居福岡市。2012年起從事網頁設計,於kanvas之名為企業製作。官網,至今參與過的網站已經100個以上,半數都是從設計到HTML/CSS、CMS系統一條龍服務。2020年2月起開辦網頁設計課程──網頁設計1on1lessonchannel,並於Twitter分享橫幅設計技巧。
作者自序
網頁上的Banner在廣告中算是尺寸非常小的一種廣告,是指將商品或服務「廣泛告知世人」的意思。Banner會很突兀地出現在資訊量龐大的網頁上,因此必須「讓人一眼就看懂資訊」,不花費巧思就無法吸引目光,成為無法實現目標的劣質Banner。本書的目標是幫助各位學會「讓人一眼看懂資訊的設計」,共分成8個基本知識與6大主題應用,介紹相關巧思與技巧。
章節目錄
◆前言◆本書使用方法◆INTRODUCTION設計前先整理!PART1成功的Banner該怎麼製作?01【層次感】迅速傳遞訊息的訣竅02【字型】提升閱讀的字型選擇訣竅03【排版】用易懂的版面彙整資訊04【裁切】去除多餘,襯托產品的訣竅05【節奏感】打破單調,避免看膩的訣竅06【配色】操縱色彩,改變氛圍的訣竅07【視線引導】打造順暢閱讀的訣竅08【裝飾】用素材展現出形象◎COLUMN_進行前必須確認!按照需求製作BannerPART2再小也好懂的排版訣竅01【斜向切割】分區讓人迅速看懂資訊02【切割兩塊】遇到條列項目、縱長圖像時很方便的排版法03【不對稱】擺脫粗糙形象的訣竅04【自然躍動】想打造歡樂的流行動態感時05【活用盤子】餐飲店廣告常用技巧06【用重疊製造立體感】照片不顯眼時07【白窗戶】趕時間時可用的排版◎COLUMN_變身各種形狀!切割不同尺寸BannerPART3一眼看懂資訊的文字設計法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配色手帳