我自己测量了徽标文件。
标准值是 #004E97，但提供的 PNG 中最常用的蓝色是 #094E96。我们没有对文件重新着色，只是将它们放在清单上，以便在从矢量源将它们导出到网络时检查最终值。
UVDRK品牌网站再次，
初心
我们设计了UVDRK的第一个网站，这是一个以熔线提升技术起家的医美品牌。我们用三个建议总结了解释名字和故事、建立颜色和运动规则以及验证方向的过程。
01 Overview
一家新公司，
技术并不新鲜
UVDRK是一个成立于2026年7月的医学美容品牌。公司可能刚刚开业，但该品牌的根源可以追溯到Ultra V首创的可熔线提升技术以及开创该技术的医生。这是权汉镇的经历。
所以这个网站必须同时显示这两件事。这是来自长期验证的经验的信任，以及回到起点并重新开始的意愿。
-
01
毫不夸张的信任
Ultracall、埋线提升、射频设备和输液泵都属于医疗设备。在这个领域，你越讲有效性，你就越不信任，所以质量必须来自适度，而不是表达的大小。
-
02
一个名字两个故事
Ultra V 的传承和 Kwon Han-jin 博士的飞跃汇集在一个名字中：UVDRK。然而，我们必须保留叙述的界限，以免将个人的职业生涯与新公司的历史混在一起。
-
03
一种声音具有不同质地的产品
从单股线到射频设备、皮肤增强剂和日常化妆品，每个产品线都有不同的个性。我们需要一种视觉惯例，以单一色调将这些产品联系在一起。
- 23张已交付计划
- 578个产品/品牌数据文件
- 13个埋线提升产品线
- 5种Skin Booster Line
- 18个化妆品
- 3种网站提案
02 The Name
我先读了名字
我的第一个问题是，“第一次看到这五个陌生字母的人怎么能读懂它们呢？”
-
UV
Ultra V 的传承
这意味着我们继承了创建“熔线提升”类别的技术和经验。
-
DR·K
权汉镇博士，再一次
它蕴含着开始熔丝线提升的人以自己的名义重新开始的意思。
-
UVDRK
The beginning, reimagined.
两个名字组合在一起，成为一个开始。本网站的所有设计决策均始于此声明。
03 Motion Language
品牌故事
贯穿单线的生命周期。
规划中的品牌故事分为五个章节，核心价值观分为传承、重新启动、拓展。我们将这些句子翻译成熔化的线所经历的四种状态。
-
01扭曲·继承
几股绞合成一根线。
Ultra V 积累的技术和经验由八股光描绘而成。股线捻得越多，它们就越成为一根实线。
-
02DISSOLVE·可溶解线
完成其工作的线融化并消失。
熔线提升的本质已转移到运动上。消失的场景并不是结束，而是下一个场景的开始。
-
03扩展·扩展
分散的颗粒分布在更广泛的区域
产品线从埋线提升扩展到Ultracall、TRIDERM、皮肤增强剂和化妆品，以散开的颗粒来表达。
-
04返回·回到起点
粒子重新聚集成一个圆圈
圆既是一个起点，也是一个完整的形式。在提案1中，标志出现在这个圆圈内，第一个场景结束。
这是第 1 号提案的主要部分中使用的 168 帧动态图形。不是让视频播放，而是根据滚动位置绘制每个页面，因此访问者可以设置故事的节奏。
04 Color
当两个文档规定不同的比率时
我们收到的品牌指南草案建议为 70 白色、20 海军蓝和 10 灰色，而视觉指导文件则以 60 海军蓝、27 白色、9 银色和 4 金色为标准。我们没有随机选择一侧或另一侧，而是筛选了两个比率并进行了比较。
它重量轻，页边距宽，信息易于阅读。然而，该品牌的第一印象减弱，很难将其与其他医院或化妆品品牌区分开来。
给人留下深刻而扎实的印象。相反，长文本和表格在深色的一面很难阅读，因此您应该留出浅色的一面。
结论是分享场景和信息。给人留下品牌印象的场景被放置在海军蓝的一侧，而需要长时间阅读的介绍和愿景则被移至明亮的一侧，以让他们喘口气。
您当前查看的此页面的背景为海军蓝 0%，浅色 0%。
-
仅徽标
Logo Blue
#004E97RGB 0, 78, 151 这是所提供徽标的颜色。它不会随意改变。 -
标志助理
Logo Gray
#586164RGB 88, 97, 100 标志符号和文字的颜色为灰色。 -
主要的
Navy
#0E1B2BRGB 14, 27, 43 这是展示品牌的场景的背景颜色。 -
背景
Deep Navy
#08121ERGB 8, 18, 30 它是运动和摄影赖以存在的最深层的背景。 -
协助
Silver
#C9CFD6RGB 201, 207, 214 它是类似于金属和光的次要颜色。 -
文本
Charcoal
#2B333DRGB 43, 51, 61 这是亮面文字的文字颜色。 -
观点
Warm Gold
#B89A64RGB 184, 154, 100 只写一行和一个点。 -
信息
White
#FFFFFFRGB 255, 255, 255 这里放置的是需要长时间阅读的信息。
DO
金色仅用在标题下的一行和强调的一个点上。
DON’T
重复的金色边框和盒子让装饰显得比奢华更重要。
05 Typography
英文文本遵循标志的纹理，韩文文本遵循阅读的方便性。
- UVDRKSemiBold 600 · 文字标记
- 医疗设备中型 500 · 标签
- ULTRACOLLight 300 · 产品名称
再次，带着和以前一样的感觉
IBM Plex Sans KR Light · 推荐视觉方向
再次，带着和以前一样的感觉
假装·网体
对于视觉方向，建议使用 Montserrat（英语）和 IBM Plex Sans KR（韩语），并使用 Pretendard 作为替代方案。在网页上，主体使用韩文粗细级别较宽的 Pretendard，而在提案 2 中，创建了一个子集网页字体，仅选择屏幕上使用的字母来减小尺寸。
06 Layout
一张强有力的图像，一两行简短的文字，和一个空白。
- 1强大的形象
- 1–2行的简短副本
- 30–40%留空
视觉方向的布局公式是为社交媒体帖子创建的。我们在网络上逐个部分重新应用了这个公式。每个屏幕上只放置一个场景，场景的变化需要滚动。
视觉方向禁止的五件事以及我们的答案
-
重复金色边框和盒子戈尔德在标题下只写了一行字和一个强调点。
-
虚假医疗设备图像所有产品，从 Ultracol 小瓶到 TRIDERM 设备，均基于实际照片。
-
过多的3D渲染、过多使用皮肤特写气氛是使用光、金属、玻璃和弯曲材料创造的。 3D 仅针对提案 2 中的纱线形状进行了测试。
-
列出英语单词，例如 INNOVATION 和 PRECISION我选择大声写下一句有意义的句子。
-
美国东部时间。像 198X 这样的虚构年份我只写了确认的历史，分为个人经历和企业历史。
07 Material
光、金属、玻璃、曲线
我首先决定用于照片和图形的材料。我们决定通过光线照射方式和材料的差异来营造奢华的感觉，而不是华丽的装饰。
- 它是一个类似于金属精度的曲面。这就是按钮和分隔器的银色色调的来源。
- 玻璃透明纹理成为皮肤增强场景的基础。
- 金线金像这样一条细线。
- 半透明板徽标和文本放置在这个平静的表面上，而不是放在照片顶部。
- 它是细线熔化线的记忆。动态图形的第一个场景从这一行开始。
08 Exploration
为一个场景绘制的图像
我们多次重新创建了主视觉和场景转换的图像。采纳的内容和取消的内容都作为决策的基础。
-
01初始草稿主
银丝
数百根银色纤维形成一个环。这是第一张隐喻埋线提升传统的图像。
-
02第1号提案获得通过
光丝
这就是支撑埋线提升部分和品牌故事第一章的背景。
-
03第1号提案获得通过
银曲线
这是一个支撑品牌介绍段落的明亮过渡场景。
-
04第1号提案获得通过
黎明时分的地平线
这是“我们又来了”场景中使用的黎明光。
-
05第1号提案获得通过
设备阶段
这就是TRIDERM所处的舞台。我发布了设备的实际照片。
-
06第1号提案获得通过
助推器玻璃
这是 Skin Booster 透明纹理的背景。
-
07第1号提案获得通过
黄金波
这是艾地苯醌化妆品导轨的底部灯。黄金只剩下光了。
-
08更换
玻璃花
细节是如此紧密和锐利，以至于我在产品之前看到了图片。
-
09更换
玻璃带
这是一个用柔和的曲线代替花朵的计划。我们一起测试了方案2的绿色调。
-
10不包括
玉兰
它温暖而美丽，但远非轻描淡写的医疗品牌。经过审核，我将其更改为实际产品的照片。
09 Structure
让菜单和主卡说同样的事情
在我收到的第一份计划中，GNB的产品菜单和主要产品卡片被划分为不同的标准。为了确保访问者能够在主页上再次找到他们在菜单上看到的名称，我们首先建议在发送报价时满足两个标准。随后，随着两类装备的加入，按照同样的顺序整理了六张主卡和六张产品菜单。
UVDRK
-
品牌故事
- Brand Story
- Vision & Mission
- Core Value
- History
- CEO
-
产品介绍
- 1ULTRACOL
- 2Thread Lifting
- 3TRIDERM
- 4Air Shine
- 5Skin Booster
- 6Cosmetics
-
新闻/社会
- 新闻稿
- 学术会议日程
- 促销活动
-
Contact
- 经销商查询
- 皮肤促进剂 询问
- 请求演示
- B2B询价
- 其他查询
-
Recruit
- 招聘信息
- 招聘职位
主卡
- 1超级通话
- 2埋线提升
- 3TRIDERM
- 4Air Shine
- 5皮肤增强剂
- 6化妆品
我们搜索了 13 个产品线的材料。
我们通过比较螺纹目录来收集有关产品线和材料的数据。对于提案 1 和 2，您都可以使用材料过滤器立即找到您想要的产品线。自己按一下试试。
13条产品线
- MONOPDO · PCL · PLCL
- TORNADOPDO · PCL · PLCL
- DOUBLE TWISTPDO
- SUPER TORNADOPDO
- INCHPDO
- COGPDO · PCL · PLCL
- MOLDING COGPDO
- EMBOSS MOLDPDO
- SUPER EMBOSS MOLDPDO · PCL
- DOUBLE MOLDPDO · PCL
- HIKOPDO · PCL
- OCTO TWISTPDO · PCL
- DOUBLE COGPDO
10 Design Drafts
三个建议，
三个问题
收到数据的第二天，我们用相同的稿件和相同的产品数据创建了三个方向。对于每一项提案，我们提出一个问题并找到答案。
初步勘探计划
银丝如果按原样复制指南，它会是什么样子？
这是应用视觉方向的颜色和字体的第一个草稿。主页以银丝图像打开，品牌故事以随卷轴旋转的环形动作展示，产品以水平流动的系列展示。该提案的结构后来成为提案 2 的基础。
- #08121E
- #F2F1EC
- #C9CFD6
- #B89A64
- 帆布环运动
- 横卷系列
- TRIDERM 模式选项卡
- 保存查询表格
第 1 号提案
光线品牌叙事能否一卷轴展现？
主页面打开，有168帧的动态图像，一页上依次排列着名称的含义、六大产品线和五个品牌故事。这个方案最忠实于视觉方向的海军蓝、银色和金色的比例。最初的标志仅放置在白色背景上。
- #08121E
- #0E1B2B
- #C9CFD6
- #B89A64
- #FFFFFF
- 滚动播放动态图形
- 名字解读场景
- 按13个产品线筛选
- TRIDERM阶段
- 水平时间线
建议2
下一个开始如果我们突破规则的界限，我们会看到什么？
以实时 3D 方式绘制的铬丝会随着您的滚动而旋转和分裂。我将颜色更改为深绿色和奶油色，并添加了六张产品影片、一个 RF 模式控制器和一个编辑设计历史。由于我们没有像指南警告的那样接近 3D，因此 3D 仅用于纱线的形状，而不是产品。
- #10231E
- #1B3A31
- #EEF0E6
- #D7F08A
- #FFFFFF
- WebGL Chrome 雕刻
- 6 部产品影片
- 射频模式控制器
- 可编辑布局
同一句话，不同的第一印象
左右移动手柄，比较提案 1 和提案 2 的第一屏。
11 Details
小场景
建立信任
-
THE NAME The beginning, reimagined.
名称解释
字母依次发光，解释了UV和DR·K的含义。
-
13 个产品线
使用材料过滤器立即找到 PDO、PCL 和 PLCL 产品线。
-
TRIDERM 阶段
装备登场，三种模式相继出现。
-
射频模式控制器
我链接了单击和滚动以指向相同的模式。
-
产品影片
仅下载所选视频，并在视频离开屏幕时停止播放。
-
水平时间轴
它显示了个人的职业历史以及 2026 年公司的成立情况。
12 Devices
任何屏幕上的同一品牌
我自己检查了每个主要屏幕宽度，从 320px 到 1440px。在低高度屏幕上，固定演示被释放以允许自然流动，并且打开减少运动的访问者将显示与静止屏幕相同的内容。
13 Guardrails
我们没有采取措施来保护我们的品牌
对于医美品牌来说，首页的完美与美观同样重要。我们从提案阶段就遵循以下原则。
什么还没有决定
- 用于深色背景的倒置徽标文件
- 检查网络字体许可证
- 查询受理地点及个人信息同意声明
- 每个埋线提升产品系列的详细规格
通过将深色标题上的徽标更改为白色来测试提案 2。收到批准的倒置徽标后，将其替换为该文件。
-
我没有使用未经确认的产品名称。
计划更改的产品名称将沿用现在的名称，直至得到确认。一旦名称确定，我们就创建它，以便只需要更改一处数据。
-
未确认的认证不显示
我们决定仅使用当前确认有效的身份验证短语和徽章，并从屏幕上删除尚未确认的项目。
-
直到数据到达才披露。
介绍材料未经证实的产品被列为“准备中”，并且没有提供性能描述。
-
我们分享了我们的个人职业生涯和公司历史。
历史是权汉镇博士的职业生涯和2026年7月UVDRK的成立分别描述。
-
这篇文章不是我发的
对于新闻和职位发布，仅创建空间来填充实际文本，显示屏幕构成的示例卡被标记为“示例帖子”。
-
产品图片仅为实际拍摄。
所有产品，从 Ultracol 小瓶到 TRIDERM 设备和化妆品，都是所交付产品的复印件。
-
至于它的功效我就不多说了。
皮肤促进剂和化妆品仅介绍主要成分，不包括功效或功能的表达。
14 Process
从询问到建议
-
初步询问和规划审查
我们审查了计划和参考资料，并发送了时间表和估算。还包括匹配菜单和主卡标准的建议。
-
内部确认及数据传递
我们收到了23个方案、原始标志、品牌指南草案、视觉指导文件和578个产品资料文件。
-
数据分析及三点建议
我们整理了两个品牌文件之间的差异以及需要确认的项目，并制定了初步的搜索计划和建议1和2。
-
审查意见的反映
在提案 2 中，柠檬绿带改为海军蓝过渡，木兰图像被替换为实际产品照片。六部产品影片齐聚一处。
-
提案确认及制定
根据最终的提案，我们开发并开放产品详细信息页面以及新闻、查询和招聘管理功能。
- Client
- UVDRK有限公司
- Brand assets
- 标志、品牌指南草案、视觉方向：由 UVDRK 提供
- Website
- 规划/信息结构、UI设计、动态图形、前端开发：BlueCanvas
- Stack
- HTML · CSS · JavaScript, GSAP, Three.js, Canvas, Vite
