发布时间：2023-7-2 分类： 电商动态
我相信很多学生都有理由看待这个理论。阅读后，他们不知道如何练习。随着时间的推移，人们会对“看到很多设计理论，但仍然表现不佳”感到困惑。今天，Jing Wen带你从理论到实践，并用《经验分享|利用品牌基因法进行图标设计》的理论重新设计了链条Tab Icon。
文章大纲：
提取理论
选择合适的设计对象
示例显示
一，提取理论
文章中使用的“使用品牌遗传方法制作图标”的理论来自于心灵的设计。从理论到实践的第一步是吸收理论的关键点，并从财新的品牌遗传方法制作图标的方法中加以完善。为方便阅读本文，这里简要介绍一些理论。有关详细信息，请阅读原始文本并吸收它。
品牌基因的定义：品牌基因的视觉水平是从单一事物中提取（或一组）视觉符号。
以下是如何将品牌基因应用于图标：
1.提取特定形状并直接应用
支付宝将徽标应用为Tab主页图标，而Same将徽标用作我的图标。
△支付宝和相同徽标在标签图标中的应用
2.画出品牌颜色
免费鱼Tab图标使用品牌颜色——黄黑色。
△在标签图标
中应用闲置鱼标志3.抢夺风格特征
网易美学标签图标使用该品牌的心形图案和品牌颜色红色。
△网易美学标识应用程序在标签图标
中在理论初步吸收之后，实践可以检验你是否真正掌握了理论并加强了对理论的深入理解。我们开始练习吧！
2.选择具有明显特征的设计对象
选择合适的品牌形象来提取基因。要求：
品牌特征清晰，易于提取且易于设计。
该品牌的Tab图标缺乏品牌标识。
更熟悉产品。
根据以上三点，选择链主页选项卡图标进行重新设计。
1.品牌特征清晰，易于提取，易于设计
连锁家是一个二手房新房交易平台，其品牌标志是一个房子的轮廓，App Icon直接应用这个图形。
△Chain Home Logo和App Icon
经过分析，我们提取了4个特征：
一条线：圆角，圆角，构成房子的轮廓。
一点：画龙点睛，图形连接。
断线：该点与线路断开。
绿色：连锁家居的品牌颜色。
△Chain Home Logo的4个特点
2.链条的链条图标缺少品牌特征
链家的当前Tab图标只是品牌基因中的绿色图标，这使得它与其他应用程序的图标无法区分。因此，仍然存在大的优化空间。
△Chain Home App Tab图标缺乏连锁品牌基因
3.更熟悉的产品
只有更熟悉的产品，您的重新设计将是相对不可预测的。然而，Icon的优化主要是从视觉水平优化的。
3.重新设计的显示
连锁店的四个标签图标是主页，消息，查看室和我。接下来，我们使用提取理论来指导设计。
1.提取特定形状并直接应用——主页图标设计
连锁店的主页图标和在线搜索的主页图标无法识别，甚至与第一行中的第三个非常相似。
△将连锁店的主页图标与在线搜索的主页图标进行比较
事实上，链标志本身就是房子的轮廓。可以说它已经具有主页的含义。它自身的四个特征使其比在线图形更容易识别。
△链主页徽标和在线搜索主页图标
《用品牌基因作图标》该理论的第一篇文章，直接应用特定形状的提取，对于链主页图标非常有用，因此我们决定使用徽标图形作为主页图标。
我们将链标识放入750 * 1334px界面，将其尺寸调整为42px后，链标识厚度为8px，链主页图标厚度为3px。优化后，链标识厚度调整为4px。
△Chain home徽标直接应用于界面
△链家徽标厚度调整为4px
2.抢夺风格特征——消息图标设计
消息图标的设计结合了我们在上面提取的链徽标的四个特征：一行，一点，虚线，绿色。请按照以下步骤逐一完成。
第一步：绘制基本形状。
步骤2：断开图标右下角（链标识的断开位置）。
第三部分：添加点并添加品牌颜色。
△消息图标设计过程
3.掌握程度——我的图标设计
在设计我的图标时，我非常痴迷于之前提取的四个品牌特征。圆角，小圆角，右下角断点和一条线组成了整个人物，但总是有点不对劲。
△我的图标设计探索
最后，选择使用大量的圆角来过度使用，断点没有附在右下角，整个Icon在视觉上更加舒适。因此，不能强加品牌特征，可以满足协调性和整体风格。
△我的图标确认草稿
其余的图标以相同的方式处理，并且四个Tab图标是固定的。图标完成后，更有必要将应用程序的场景检查匹配。
△具有连锁品牌特征的标签图标
△在界面
中应用优化的Tab图标4.掌握程度—— 8个入口图标设计
Tab图标完成后，我们发现链的主页上的八个入口图标有一些优化空间。八个图标使用与徽标圆角不匹配的尖角。使用矩形元素而不是徽标点缺乏某些品牌特征。此外，整个主页上的其他控件也相对圆润，这使得具有锐利直角的八个图标有点尴尬。此外，视觉大小也不同，有些图标很复杂。
△主页上的8个主页入口图标
由于Tab图标的设计具有明显的特征，因此链条主页上的八个入口图标的优化将更加受限，并且仅添加圆角和圆点的两个品牌特征以使其回响。
△优化链主页8入口图标
△优化图标效果应用效果
四。思考总结
从“以品牌基因为图标”的理论来实践，关键是品牌特征的提取，其次是品牌特征的灵活运用，品牌特征的应用程度是整个图标协调的重点。
论文的结尾是如此之浅，我知道这件事必须进行。在理论初步吸收之后，实践可以检验你是否掌握了理论并加强了对理论的深入理解。所以去操作巩固理论！
作者：Jenny Huang Jingwen（微信公众号：“Jenny Huang Jingwen”），平安银行愿景&插画。微博设计美学博主，花瓣认证设计师，优优网，设计指导员，深圳插画家协会专业会员，视觉中国合约设计师。
本文最初由@Jenny Huang Jingwen发表。未经许可，禁止复制。
标题图来自英国，基于CC0协议
