- dday1989902026-08-2468008
最近 Vokie 官网被一些朋友夸了(我觉得审美这东西是各有喜好的,喜欢的朋友谢夸),很多朋友也好奇:设计参考都是从哪里找的?所以,我也想发一个帖子分享一下。
👉 vokie.com

我清理了一遍收藏夹,最后留下 12 个比较常用的网站。先说一个可能有争议的感受:
Awwwards 很适合打开脑洞,但真要落到产品页面上,Mobbin 、Refero 这类真实产品库往往更实用。
我的使用顺序一般是:
找整体方向 → 拆真实产品的结构和流程 → 补 Hero 、导航、CTA 等局部细节。

1. 找整体方向
- Recent
每天更新网页、品牌、字体和动效案例。还没有明确方向时,我通常先逛这里。
- Lapa Ninja
Landing Page 灵感库,可以按行业、风格、颜色和建站工具筛选。
- Land-book
商业网站和作品集比较多,整体质量比较稳定。
- Awwwards
适合找视觉创意和高完成度动效,但有些案例离真实产品比较远,不太适合直接照搬。
2. 拆产品 UI
- Mobbin
收录真实 App 和 Web 产品的界面及完整流程,做产品设计时非常实用。
- Refero
可以按页面和组件查找真实产品 UI ,尤其适合 SaaS 产品。
这两个站更适合在确定视觉方向之后,用来验证真实产品是怎么组织信息和流程的。
3. 抠局部细节
- Design Spells:细节交互、动效和彩蛋
- SupaHero:网站 Hero 和首屏设计
- Navbar Gallery:导航栏和菜单
- CTA Gallery:CTA 、转化区块和文案
- Footer:Footer 设计
4. 找实验感
- Loadmo.re
收录比较大胆、非常规、有实验感的移动端网站,适合找一些不一样的设计思路。
如果只能留下 3 个,我会选 Recent 、Mobbin 和 Design Spells:一个找方向,一个拆真实产品,一个补细节。
你会留下哪 3 个?
另外也想听听大家对 Awwwards 的看法:它对真实项目到底是启发更多,还是干扰更多?有漏掉的宝藏网站也欢迎直接贴链接,我整理后补到楼里。
主楼 - eurekawu2026-08-2443645
牛的收藏
- dday1989902026-08-2468008
- Chengyunlai2026-08-2454848
很赞,能否尝试把这些过程形成一个 skill ?
- Chengyunlai2026-08-2454848
风格很字节哈
- ohoh2026-08-2447778
不是我吹
你这做的
怎么说了
哎
一言难尽
做的
艹
做的
真
TMD
不孬
!!! - dday1989902026-08-2468008
@Chengyunlai 这也能看出来?在字节做了几年产品
- dday1989902026-08-2468008
- dday1989902026-08-2468008
@Chengyunlai ui skill 可以看看这个项目: http://www.ui-skills.com/
- Chengyunlai2026-08-2454848