精選 · 開放 · 免費

Littletroop

實驗性設計工作室作品集,以趣味 3D 互動球體與大膽排版為特色。

AgencyPlayful3DExperimentalExpressive
Littletroop 網站截圖
↓ 下載設計系統包 (60 MB)在 OpenDesign 中開啟

原站: https://littletroop.com

📦 瀏覽包內檔案 →

01

設計氣質 DNA

工藝文化想像力趣味3D

一個充滿趣味的數位玩具箱,展示沉浸式 3D 工作室作品。

02

色彩

#000000Ink
#ffffffBG
rgba(0,0,0,0.1)Line

極簡主義畫布,讓色彩豐富、具互動性的 3D 主視覺元素成為主要的視覺焦點。

03

字型

grotesque-sans

04

間距

4px
8px
16px
20px
24px
30px
40px
60px
89px

流動式網格,為懸浮 UI 元素設有特定 padding。

05

表面 (圓角 / 陰影 / 邊線)

sm · 4px
md · 8px
lg · 50px
pill · 999px

1px 細實線,用於細微的水平分隔。

06

版面

1920container
12columns
20pxgutter
768 / 1024breakpoints

全出血佈局,搭配懸浮角落導覽與置中 3D 焦點。

07

動效與互動

220msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

主視覺元素的互動式 3D 旋轉 · 全出血專案展示之間的無縫捲動過渡

標準指標游標,搭配文字回饋。 · 透過底線文字連結進行直接導覽。

08

組件

09

文案語氣與禁用清單

10

包內真實截圖

擷取自真實頁面 · 真 computed styles

11

System Prompt

Little Troop 是一個充滿趣味的實驗性設計工作室作品集,其特點在於巨大的互動式 3D 主視覺元素,主導著極簡的白色 (#ffffff) 畫布。排版依賴一種纖細的 grotesque-sans(Arial Narrow)作為展示與內文,並使用緊湊的字距和粗體字重於導覽。佈局完全流動且非網格導向,懸浮文字固定於視窗角落。關鍵禁忌:永遠不要套用投影或厚重邊框,永遠不要使用網格進行佈局,也永遠不要將主要的互動式 3D 元素隱藏在標準 UI 容器後方。

把這份品味接進你的 Agent

把這套設計的機器可讀規格——色彩、字體、動效,整套 DNA——直接交給你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

en · zh-CN · zh-TW · ja · ko