對很多品牌和網站而言，登陸頁在數位營銷上有着至關重要的作用，尤其是在提高轉換率方面。不過，設計出符合目標受眾口味的登陸頁，往往需要花費大量精力，這實在是消耗巨大、效率極低。本文將為各位品牌網站帶來了一個登陸頁實戰案例分享，有興趣的朋友可往下看!

UI設計案例分析

UI設計案例分析：分享一個登陸頁實戰案例

【案例背景】

英國公司 Collectively Intelligent Limited旗下一款名為Colony 的線上數字協作平台需進行單獨設計登陸頁。

該平台的創建，旨在幫助全球不同國家和地區的用戶可透過它來共同創建公司。在社區中，不同用戶可以圍繞一個目標進行合作，協同創造，共同管控資金，分享項目收入。

登陸頁設計要求：

1. 登陸頁設計要相對簡單且平易近人，同時能傳達出產品的價值主張;

2. 登陸頁的主要功能是幫助用戶了解它的運作以及從中獲得的好處。

UI設計案例分析

【登陸頁設計的核心特點】

有些會認為，登陸頁盡可能包含產品/服務細節才能吸引用戶。在實際操作中，登陸頁的設計不應包含過量信息，而是直接讓用戶注意到產品的核心價值，凸顯對用戶有利的信息。

因此，進行登陸頁設計時，通常會採用相對簡約明晰的UI設計，透過富有凝聚力的UI元素(如CTA按鈕和表單)來呈現。

UI設計案例分析

【着陸頁設計內容】

接下來，圍繞着登陸頁設計的核心特點進行設計，設計師透過有層次地規劃整個UI佈局和各部分的優先級，讓用戶逐步獲取信息。

我們一起來看看設計師到底做了哪些UI設計工作：

UI設計案例分析

◆ 自定義插畫

自定義插畫是登陸頁中重要的UI組件，有助於用戶更容易理解產品的功能和概念。因此，在UI設計中使用插畫是相同普遍且有效的選擇。

為了設計出更加有效的首屏插畫，設計師嘗試將地球上不同區域的用戶相互連接的概念進行設計，同時確保整個登陸頁UI設計與產品主題保持一致，營造出友好、平易近人的氛圍，讓用戶對整個公司形象產生足夠的好感。

考慮到產品的商業定位和客戶的方向選擇，產品UI設計傾向於淺色背景和流暢的輪廓，並繪製了一系列的變體。而配色方面，則採用了集中明亮但並不富有侵略性的色彩，如粉紅、黃色、綠松石色以及紫色。

UI設計案例分析

◆ 配色方案

設計師還為不同功能設計自定義插畫。為了簡明地展示產品功能而存在，同時方便用戶可以快速理解產品的功能和本質，這些插畫的配色方案與首屏插畫保持一致。此外，插畫還會搭配一些微文案，幫助用戶了解這功能特點。

如你所見，所有插畫都使用大量留白和微妙元素凸顯產品的複雜性。插畫所選用的配色方案也極具親和力，使得整個UI設計顯得非常友好、富有吸引力。

為了讓整個界面看起來足夠一致，設計師還製作了產品故事插畫，用於闡述用戶使用該產品的好處，並吸引潛在客戶關注，給用戶留下好印象。