掌握 3 要領,新手也能設計出「簡潔、易懂」的懶人包圖卡!

更新於 發佈於 閱讀時間約 6 分鐘

許多人都有這樣的煩惱,手上的資料很豐富齊全,想要和他人分享,卻難以清楚表達。未經整理的資訊,就像是沒有分段的文章,儘管內容很好,但就是讓人讀不下去。

想要做出簡單好讀的懶人包圖卡,如果沒有設計技能,有辦法做到嗎?身為一位經常製作社群圖卡的設計師,我認為懶人包的重點是「資訊整理」,美感只是基本條件。然而不會設計的人,只要掌握這 3 個要領,也能做出具有一定質感的懶人包圖卡。


懶人包圖卡設計 3 要領

懶人包圖卡設計 3 要領


要領 1:一次一重點


懶人包圖卡最忌諱的就是「資訊爆炸」,就像說話,一次只說一件事,總比一次說十件事更好理解。在開始製圖之前,先把內容理出重點,最好可以分類或列點,舉例來說,一場活動的訊息就可分成「活動資訊」、「時程表」、「聯絡方式」等,或者是將盤點美食優惠列成 10 大點。

一次只要一重點,一張圖只說一個項目,有 10 大點就分成 10 張圖,處理少少的資料總比處理大量文字來得輕鬆吧!


要領 1:一次一重點

要領 1:一次一重點


要領 2:用色單純化


繽紛的色彩可以很活潑,也可能很雜亂,要是沒有掌握好界線,就很有可能成為後者。最不容易出差錯的方式,就是將用色單純化。舉例來說,使用單色或雙色來做為主要配色,不確定怎麼配色的話,選擇同色系做深淺變化也很好。

重點文字的部分,可使用對比色來做強調,就能在不破壞整體版面的情況下,凸顯想要傳達的重要資訊。


要領 2:用色單純化

要領 2:用色單純化


要領 3:字型統一化


不知道怎麼搭配字型,又想讓懶人包圖卡的質感提升,那就別讓圖上的字型超過 2 種。當畫面上有越多種類的字型同時出現,版面就會越顯雜亂。當然,在茫茫字海當中,千萬別使用新細明體!它真的很醜。

除此之外,字體的粗細是區分內容層次的絕佳工具,最大的標題字體最粗,內文則最細。掌握字體粗細的使用,即使只用同一種字型也能變化出很多花樣。


要領 3:字型統一化

要領 3:字型統一化



只要掌握以上 3 要領,即使是設計小白,也能做出簡潔有力又好看的圖卡啦!


...


或者至少,能夠理解國泰世華 CUBE App 究竟有多美!


介面以功能分類,線稿 icon 輕鬆辨別


CUBE App 以主要功能分類,一個分頁提供一個重點,包含「帳務總覽」、「投資」、「貸款」、「保險」、「更多」,功能很好找,介面使用很直覺。

我自己在使用網路銀行的習慣上,最常開啟的就是查詢帳務及轉帳功能,一打開 CUBE App 馬上就能找到。尤其是在帳務明細的介面,CUBE App 將搜尋功能做得很便捷,不只能搜尋帳務日期,還能分別搜尋「存入/提出/簽帳金融卡/薪資獎金」,甚至是使用「關鍵字」搜尋,這樣的方便程度,是在其他網路銀行 App 中相當少見的。不得不說,帳務明細採取白色方格堆疊呈現的方式,將最新資訊條列於最上方,視覺上簡潔易讀,一目瞭然,也是我相當滿意的部分。


CUBE App 以主要功能分類,功能很好找

CUBE App 以主要功能分類,功能很好找


帳務明細以白色方格堆疊呈現,簡潔易讀又美觀

帳務明細以白色方格堆疊呈現,簡潔易讀又美觀


選用白色為基底,淺綠色為主色調,適度跳色抓重點


CUBE App 的整體用色相當簡單,以白色為主、淺綠色為輔,並採用重點式的紅色、橙色、黃色,用暖色系來吸引目光,可以很輕易的從用色上,看出重點在哪裡、哪裡有新訊息正等待閱讀。

因為用色實在很清爽,在使用上較不會感到疲勞,而且能夠很快找到想使用的功能,在視覺的引導上很有幫助。


重點式紅色點點,作為提醒新訊息用途

重點式紅色點點,作為提醒新訊息用途




字型統一卻不單調,巧妙創造分明層次


在字型的選用上,CUBE App 的中文字基本上都是使用同樣的黑體,並採用不同粗細、灰階程度,來呈現出訊息的重要順序。這點在設計上真的很重要,不只能讓整體設計更有一致性、提升美感,善用字體粗細和大小,就能自然地將使用者的目光引導至對的地方。

CUBE App 採用統一化的字型,以字體粗細和顏色深淺來展現層次感

CUBE App 採用統一化的字型,以字體粗細和顏色深淺來展現層次感


以簡潔、留白創造美感的 CUBE App

以簡潔、留白創造美感的 CUBE App


整體來說,CUBE App 的介面設計不只有小清新風格,在功能使用上也很人性化,是設計師會愛不釋手的類型,不禁讓人心想,原來金融世界也可以具備美學啊!

另外提到,為同集團的國泰金控最近推出 國泰優惠CUBE Rewards App,一樣是走小清新風格的氣質設計,裡頭還能使用國泰世華小樹點兌換電子票券、航空飯店里程或是實體商品,我個人是超愛累積點數換票券的這種模式,因為通常用點數換都會比較便宜啊,精打細算也是種美學!


小樹點可用於兌換電子票券、航空飯店里程、實體商品等

小樹點可用於兌換電子票券、航空飯店里程、實體商品等



對於超愛開各種數位帳戶、使用超過 8 家網路銀行 App 的我來說,說實話國泰世華 CUBE App 介面設計真的很有質感,適度的留白,讓介面既乾淨又美觀。剛好多年前辦的簽帳金融卡 (大樹款) 即將停辦,最近收到寄來的新卡片,也順便來分享一下,灰灰藍藍的新卡面質感灰,真的很好看!可以深深的感受到,國泰世華是認真要將美學植入所有產品之中啊!


國泰世華新款簽帳金融卡,卡面灰藍色很有質感

國泰世華新款簽帳金融卡,卡面灰藍色很有質感


本文係由國泰世華銀行邀約

謹慎理財 信用無價 信用卡暨預借現金之各級別循環信用年利率為 6.75%~15%(依本行信用評分制度定期評估,循環利率之基準日為 104年9月1日)。預借現金手續費:預借現金金額乘以 3%加上新臺幣150元或美元5元,其他相關費用係依本行網站公告。




喜歡我的文章,請按下追蹤、愛心、留言~小小的舉動對我來說是大大的鼓勵 !

我的粉絲專頁 邊境牧羊犬的觀察筆記 三不五時會分享生活小故事,歡迎追蹤 :)


我是邊境牧羊犬,自由接案的數位內容設計師,熱愛世上美的一切,在此將分享我感興趣的書籍、影視作品、旅遊美食、以及各種療癒心靈的事物。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
本文介紹三款好用的配色工具:Adobe Color、Coolors 和 Canva Colors,幫助不懂設計的人輕鬆配出好看的顏色組合,可將顏色用於社群圖卡、品牌視覺設計等。
什麼貼文容易瘋傳?有創意的、有共鳴的,只要讓人心中萌生起「不能只有我看到」,就有機會成為爆文。然而爆文並不是想寫就能寫出來,回到最初「貼文」目的很單純,也許是銷售產品,推廣某種服務,都是一件欲與粉絲分享的事情。那麼,要怎麼把這件事說好,同時又要讓人看了有共鳴、覺得喜歡呢?這三個方式,希望對你有幫助!
你想成為小編嗎? 經營社群幾乎可說是所有企業必備的工作項目,不管是電商、實體商家、甚至是政府部門,都需要一位可以為他們規劃社群貼文的好手。 既然這樣,想從事社群行銷工作,究竟需要具備哪些能力呢? 姑且不論創意與跟隨時事潮流的能力,畢竟這比較難透過訓練來獲得,我認為首要必須擁有的分別是以下三大技能:
很多人都想做影片,但卻因為不知道該用甚麼軟體、不知如何剪輯,就開始退卻。剪輯影片,真的是一件難事嗎?6步驟完成你的第一支影片!我們就從一支影片的誕生,一一分解製作影片的過程吧!
因為喜歡畫畫所以想讀設計系? 喜歡做手作所以選填了設計系? 在開學之前,希望能讓對「設計」領域充滿期待的你們,先停下腳步想一想。 你,真的準備好了嗎?
只要懂得找出「目標受眾」,未來不管什麼事都難不倒你! 不僅僅受限於商品的設計,還可以用在行銷「人」身上,在找工作的時候,將人視為「商品」進行包裝,想辦法彰顯優點、掩飾缺點。寫作也像在賣商品,必須知道自己的文章是寫給誰看的。只要知道目標喜歡什麼類型的文章,那麼只要寫出那樣類型的作品便有機會得到賞識。
本文介紹三款好用的配色工具:Adobe Color、Coolors 和 Canva Colors,幫助不懂設計的人輕鬆配出好看的顏色組合,可將顏色用於社群圖卡、品牌視覺設計等。
什麼貼文容易瘋傳?有創意的、有共鳴的,只要讓人心中萌生起「不能只有我看到」,就有機會成為爆文。然而爆文並不是想寫就能寫出來,回到最初「貼文」目的很單純,也許是銷售產品,推廣某種服務,都是一件欲與粉絲分享的事情。那麼,要怎麼把這件事說好,同時又要讓人看了有共鳴、覺得喜歡呢?這三個方式,希望對你有幫助!
你想成為小編嗎? 經營社群幾乎可說是所有企業必備的工作項目,不管是電商、實體商家、甚至是政府部門,都需要一位可以為他們規劃社群貼文的好手。 既然這樣,想從事社群行銷工作,究竟需要具備哪些能力呢? 姑且不論創意與跟隨時事潮流的能力,畢竟這比較難透過訓練來獲得,我認為首要必須擁有的分別是以下三大技能:
很多人都想做影片,但卻因為不知道該用甚麼軟體、不知如何剪輯,就開始退卻。剪輯影片,真的是一件難事嗎?6步驟完成你的第一支影片!我們就從一支影片的誕生,一一分解製作影片的過程吧!
因為喜歡畫畫所以想讀設計系? 喜歡做手作所以選填了設計系? 在開學之前,希望能讓對「設計」領域充滿期待的你們,先停下腳步想一想。 你,真的準備好了嗎?
只要懂得找出「目標受眾」,未來不管什麼事都難不倒你! 不僅僅受限於商品的設計,還可以用在行銷「人」身上,在找工作的時候,將人視為「商品」進行包裝,想辦法彰顯優點、掩飾缺點。寫作也像在賣商品,必須知道自己的文章是寫給誰看的。只要知道目標喜歡什麼類型的文章,那麼只要寫出那樣類型的作品便有機會得到賞識。
你可能也想看
Google News 追蹤
Thumbnail
2025 年,從分享精彩的 #Myvocus2024 年度回顧開始! #Myvocus2024 年度回顧通知已送達 vocus 的 2024 有超過 12 萬筆訂單、35 萬則以上的內容、16 萬以上的新會員、4 千+ 筆數位商品訂單,5 萬 + 則貼文! 曬曬你的 2024 vocus 吧!
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
這篇文章我將藉由「點子就要秀出來」這筆書,節選出創意的10個撇步。正在創作的你,看完後一定會有很大的收獲。
Thumbnail
為了避免作品落入冗長無止盡,或者平淡的窘境中,我整理了幾位作家的公式與絕招供你參考。
Thumbnail
這篇文章剖析瞭如何創作一張極簡風格的閱讀心得圖片,突顯閱讀的智慧和成長。同時還介紹瞭如何融合自然元素和明亮色彩,打造出具有不同風格的閱讀心得圖片。
Thumbnail
在現代數位時代,我們習慣於直接打開簡報軟體,快速輸入想法,添加圖片和動畫,希望能製作出一份令人驚豔的簡報,可是這種做法往往忽略了一個簡報的本質——傳遞資訊,與聽眾建立真實的連結。今天分享一招我自己也經常在用的方法:要準備簡報,就先別打開簡報(軟體)。 因為麻煩,反而精鍊 在開始製作簡報之前,
  貴安。內含勸世成分。   下面提到的問題,都是比較難開一篇解釋,或已經在主題中,卻很常發生的問題,也只是我個人建議,經驗分享,速問速達!對你來說可能是幹話,也可能是當頭一棒。   或許你已經經歷過,或許正在經歷,也可能是我經歷過或正是我的問題。   未來若有新增,湊得夠多了會開新篇,也歡迎
Thumbnail
篇寫給「已經有在做卡片筆記法,但有點掙扎,覺得怎樣都抓不到竅門的人」看。
Thumbnail
Ae 小技巧:如何製作網格 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
雖說很多事看起來「真的是基礎」,但總是會被忽略!這些事不是擺爛覺得不用講、不需要要求、反正做得出來就不用學新的東西⋯⋯為什麼多數人寧可用錯的方法、花很多時間在那些明明有更好的方法「做得出來就好了」的工作模式裡?而不想要花多一點時間學習和溝通好工作的流程?
Thumbnail
作者用常見的生活模式為底,分享所見所聞,提供自己對於這些情況的建議。詞彙的使用跟實力培養絕對是需要時間的,也非常需要靠別人的作品來當作自己的養分來源,多閱讀別人的書籍、文字、而且是有意識的學習,然後再加上實踐,相信慢慢就能寫出吸引人的文字、甚至發展出自己的風格。
Thumbnail
專心聽著講座、並拍下簡報的你,回家真的有複習那些照片、記下重點嗎? 如果沒有,即使當下再感動、再重視,在乎的知識點便隨時間悄悄從你腦海散逸……
Thumbnail
2025 年,從分享精彩的 #Myvocus2024 年度回顧開始! #Myvocus2024 年度回顧通知已送達 vocus 的 2024 有超過 12 萬筆訂單、35 萬則以上的內容、16 萬以上的新會員、4 千+ 筆數位商品訂單,5 萬 + 則貼文! 曬曬你的 2024 vocus 吧!
Thumbnail
嘿,大家新年快樂~ 新年大家都在做什麼呢? 跨年夜的我趕工製作某個外包設計案,在工作告一段落時趕上倒數。 然後和兩個小孩過了一個忙亂的元旦。在深夜時刻,看到朋友傳來的解籤網站,興致勃勃熬夜體驗了一下,覺得非常好玩,或許有人玩過了,但還是想寫上來分享紀錄一下~
Thumbnail
這篇文章我將藉由「點子就要秀出來」這筆書,節選出創意的10個撇步。正在創作的你,看完後一定會有很大的收獲。
Thumbnail
為了避免作品落入冗長無止盡,或者平淡的窘境中,我整理了幾位作家的公式與絕招供你參考。
Thumbnail
這篇文章剖析瞭如何創作一張極簡風格的閱讀心得圖片,突顯閱讀的智慧和成長。同時還介紹瞭如何融合自然元素和明亮色彩,打造出具有不同風格的閱讀心得圖片。
Thumbnail
在現代數位時代,我們習慣於直接打開簡報軟體,快速輸入想法,添加圖片和動畫,希望能製作出一份令人驚豔的簡報,可是這種做法往往忽略了一個簡報的本質——傳遞資訊,與聽眾建立真實的連結。今天分享一招我自己也經常在用的方法:要準備簡報,就先別打開簡報(軟體)。 因為麻煩,反而精鍊 在開始製作簡報之前,
  貴安。內含勸世成分。   下面提到的問題,都是比較難開一篇解釋,或已經在主題中,卻很常發生的問題,也只是我個人建議,經驗分享,速問速達!對你來說可能是幹話,也可能是當頭一棒。   或許你已經經歷過,或許正在經歷,也可能是我經歷過或正是我的問題。   未來若有新增,湊得夠多了會開新篇,也歡迎
Thumbnail
篇寫給「已經有在做卡片筆記法,但有點掙扎,覺得怎樣都抓不到竅門的人」看。
Thumbnail
Ae 小技巧:如何製作網格 動態後記系列會記錄一些我在製作中的記錄,可能是分解動畫、小技巧、發想、腳本......等等。 每篇都是小短篇,就是補充用的小筆記,沒有前後順序,可跳著閱讀。
Thumbnail
雖說很多事看起來「真的是基礎」,但總是會被忽略!這些事不是擺爛覺得不用講、不需要要求、反正做得出來就不用學新的東西⋯⋯為什麼多數人寧可用錯的方法、花很多時間在那些明明有更好的方法「做得出來就好了」的工作模式裡?而不想要花多一點時間學習和溝通好工作的流程?
Thumbnail
作者用常見的生活模式為底,分享所見所聞,提供自己對於這些情況的建議。詞彙的使用跟實力培養絕對是需要時間的,也非常需要靠別人的作品來當作自己的養分來源,多閱讀別人的書籍、文字、而且是有意識的學習,然後再加上實踐,相信慢慢就能寫出吸引人的文字、甚至發展出自己的風格。
Thumbnail
專心聽著講座、並拍下簡報的你,回家真的有複習那些照片、記下重點嗎? 如果沒有,即使當下再感動、再重視,在乎的知識點便隨時間悄悄從你腦海散逸……