2024

爪族動力

UIUX / Website / Front-end

網頁視覺 Elementor WordPress CSS

INTRODUCTION

簡介

爪族動力是一家專注於提供毛孩健康產品的品牌,致力於提升毛孩的生活品質。
運用宇宙科幻與動物主題融合,創造獨特的品牌視覺定位。搭配未來感 HUD 元素與像素字體,突顯品牌創意與產品科技感。
視覺風格鮮明、互動設計流暢,並以動畫與高對比配色提升用戶停留率,是一個成功結合趣味與商業導向的網站設計範例。

INTRODUCTION

簡介

運用宇宙科幻與動物主題融合,創造獨特的品牌視覺定位。搭配未來感 HUD 元素與像素字體,突顯品牌創意與產品科技感。視覺風格鮮明、互動設計流暢,並以動畫與高對比配色提升用戶停留率,是一個成功結合趣味與商業導向的網站設計範例

Project Background

專案背景

本案業主為一間專注於寵物保健品的品牌商,長期投入毛孩健康營養領域,產品涵蓋日常保健、機能強化與天然配方等類別。面對市場上多數寵物品牌普遍採取溫馨療癒、可愛親民的視覺策略,客戶期望打造一個「與眾不同、令人眼睛一亮」的品牌形象,從視覺到體驗全面跳脫傳統框架。

在初期訪談中,業主明確表達希望能以新潮、趣味、具風格辨識度為核心設計方向。最終定調以太空冒險、未來科技、角色設定等要素包裝產品與網站體驗,使品牌不僅傳達健康專業,同時展現強烈風格化的品牌個性。

Style Ideas

風格發想

整體設計語言大膽使用未來感元素與霓虹色彩,並結合擬人化的寵物角色設定,使品牌在競爭激烈的市場中脫穎而出。

  • 趣味迷因
  • 復古未來主義
  • 賽博龐克

Visual Design

視覺風格

  • 宇宙科幻 × 寵物主題混搭風格

    將「太空」主題與「動物寵物」結合,呈現強烈的未來感與趣味感。狗穿宇航服、貓咪漂浮在宇宙中,打造出品牌鮮明的創意視覺語言。

  • 高飽和亮色+霓虹描邊

    使用亮紫、亮藍的霓虹描邊與發光特效,創造出像素科技感,並與黑色宇宙背景形成對比,吸引目光。

  • 字體設計強烈風格化

    主標題使用像素字體,呼應遊戲、科技與未來的主題調性。

  • 動態構圖與分層

    各版面運用多層視覺元件,如隕石、星球、HUD 元素(雷達圖、科技框架),讓整體畫面更具層次與沉浸感。

Project Goals

專案目標

  • 品牌差異化

    透過 有趣的賽博龐克宇宙與遊戲風格製造互動性,在市場中建立獨特視覺識別度,讓品牌在眾多毛孩產品中脫穎而出。

  • 清晰傳遞資訊

    呈現產品特色、用途與購買流程,提升使用者對品牌的理解與信任。

  • 使用者導向

    強化與消費者的互動體驗,讓瀏覽、購買流程直覺、順暢。

Web page display

成果展示

01 HOME PAGE / 首頁

01 HOME PAGE / 首頁

02 PRODUCTS / 產品頁面

02 PRODUCTS / 產品頁面

03 CONTACT / 聯絡與會員頁面

03 CONTACT / 聯絡與會員頁面

SOLUTIONS

UI/UX 優勢

  • 區塊設計明確

    每個段落透過不同背景與圖像,清楚區分資訊內容,如產品介紹區、訂閱區、聯絡區等。

  • 強化品牌記憶點

    狗狗宇航員、像素字體與「START」字樣等互動語彙,建立強烈識別度與遊戲式引導。

  • 視覺互動指引

    使用「START!」「SUBSCRIBE」等主動式字句,引導用戶操作與互動。

Banner使用動畫Layslider設計,在網頁開頭打造搶眼的視覺效果

CTA融合宇宙元素

豐富的動畫效果,增添互動性

© Ring Vision – Design by Ring