ZoomDetails

桌面端UI Kit 整理

整理的UI Kit UI 套件-01 UI 套件-02 UI 套件-03 UI 套件-04 UI 套件-05 整理的版面设计 版面设计-01 版面设计-02 版面设计-03 版面设计-04 版面设计-05 整理的首页效果图 首页效果图-01 首页效果图-02 首页效果图-03 首页效果图-04 首页效果图-05 腾讯110 首页打假宣传 Tencent Banner Design For Emergency 是什么：这是我制作的一套概念版本的桌面端控件设计，这个设计能够帮助我更好的提升交互方面的能力，对设计有更多的认识。 Client/客户Tencent 腾讯 Time/时间February 2020 2020年02月 Industry/行业Internet 互联网
交互设计 / UX, 移动端设计 / Mobile UI
ZoomDetails

音乐应用Soundi App 设计 | Soundi App Music App Design

Soundi 音乐App设计 Soundi Music App Design 是什么：这是我整理的一套桌面端的UI kit，主要用于练习和展示一套比较好的组件库的样式和使用方式。 通过简洁的蓝色，强烈的对比，突出企业类型产品(to b)的特点和效率性，让用户即能够体验到界面的统一性，又能够体验到品牌塑造的一系列性。 Client/客户Transsion 传音集团 Time/时间September 2020 2020年09月 Industry/行业Internet Education 互联网教育
交互设计 / UX
ZoomDetails

Morer 社交出海APP 社交等级图标设计 / Social App Level Badge Design

下面是一些收集的草稿和一些手稿过程 过程不全，仅截图显示，这是一些发散的思维，其中草稿也尝试了比较多的方案，最终设定为上图所示的。 早期的草稿 早期有设计过一版比较单一化等级的方案，扩展性不强，所以之后就在此方案上优化了。 [Morer] 社交App 等级图标设计 [Morer] Social Level Icons Design 是什么：这是为More出海类型的社交App设计的用户等级徽章，他们分别对应了用户在App中使用的相关奖励。 怎么做：在整个设计过程中，我们的目标是年轻化、有趣，所以在图标设计的时候，我会去首先调研一些可爱、年轻、夸张的表情，以及虚拟角色的样式，这样能够让更多人复合这个调性。 Client/客户Morer (网易出海App) Time/时间September 2020 2020年11月 Industry/行业Internet Social 互联网社交
ZoomDetails

[GDU 无人机管理系统] 封面设计 (个人消费类) / GDU Flight System Cover Design

[GDU 无人机管理系统] 封面设计 [GDU Flight Management] Cover Design 是什么：这是我为高德红外无人机子品牌无人机CD所设计的封面，为了更好地贴合[无人机]这一小众消费者，我设计了完全不同的3种设计风格，通过对比和测试，最后让用户选择喜欢的作为其专属软件CD的整体包装。 为什么：由于客户比较小众且只分发给具体的用户(外人无法直接购买)，所以公司领导决定用CD代替其他常用介质进行软件的封装。虽然在2020年比较过时，但是高德红外属于军工类企业，都有严谨的[保密]工作。CD作为一个不容易被广泛传播的媒介，我们经常使用CD。 怎么做：请详见左侧图片。 Client/客户Guide 高德红外 Time/时间September 2020 2020年09月 Industry/行业Internet Education 互联网教育
ZoomDetails

洋葱数学 招聘页面交互&视觉设计 / OnionMath Career Page Design

洋葱数学 招聘页面设计 OnionMath Career Page Design 是什么：这是我带领团队为 [洋葱学院] 招聘页面所制作的设计，其中全部虚拟化的IP形象完整的符合了洋葱数学的整个对外传播形象，年轻、朝气、极具亲和力。 为什么：产品经理会给到我们详细的需求，在设计过程中，我们会依据我所建立的品牌设计视觉资产库以及对应的IP形象作为主体，进行对应的设计，让我们每个员工的形象展现出符合[洋葱数学]气质的一面。 怎么做：从描述场景出发，我们的对首个插图进行了对应的形象化设计，其中人物都是从我们的创始人形象抽象绘画而来，表明我们是一个极富想象力的创新互联网教育公司。其次，给与了各个职位赋予了亲切的形象，让每一位求职者能够心领神会，更加喜欢我们公司的文化。 Client/客户OnionMath 洋葱数学 Time/时间August 2020 2020年08月 Industry/行业Internet Education 互联网教育
交互设计 / UX
ZoomDetails

洋葱学院运营活动设计 / OnionMath Communication Design

洋葱学院运营活动设计 OnionMath Communication Design 是什么：这是与团队小组的合作项目，为”洋葱数学”设计的运营页面，他们会投放到不同渠道。因为“洋葱数学”的业务发展是通过营销设计来覆盖更多受众人群，我们尽可能的去满足营销设计的需求。合作项目，团队作品，并非所有内容本人独立完成。这里展示了整个内容是为了更好的说明和表现我作为团队的负责人，和团队同事一起规划出视觉效果统一且独一无二的视觉风格，如果没有比较好的规划，整个视觉呈现很难达到如好的游戏般质感的体验。 为什么：教育类产品的营销设计频率高、大多数都与卖课关联性强，所以我们更多的是从视觉表现的层面帮助洋葱数学建立完整的传播方案。 怎么做： 建立营销设计素材中心，从早期到后期积累了包括常用的活动元素1000+，他们会已模块化的拆分的形式出现在大大小小不同的活动中，例如双十一活动、打卡活动、教师大会、暑期班、秋季班、春季班等等。 建立了主图的完整插画IP和动作形象，能够帮助用户更好的理解活动场景的需求。 搭建了完整的小活动的课拆解化的素材元素，适用于各种不同的分发渠道(国内外应用商店、线下、App内部) 通过完整的IP形象运用，我们能够针对性的设计出完全符合公司商业化的主题，提高公司的客户忠诚度(视觉传播的角度)和转换率。 Client/客户OnionMath 洋葱数学 Time/时间December 2017 2017年05月 Industry/行业Mobile Internet, Education 移动互联网、教育 Behance Show / Behance 作品展示None 暂无 Dribbble Shot / Dribbble 作品展示None 暂无
插画 / Illustration, 移动端设计 / Mobile UI, 营销设计 | Communication
ZoomDetails

云舒写-在线直播小程序 交互设计 / YunShuxie Live Player UX Design

云舒写-在线直播小程序 交互设计 YunShuxie Live Player UX Design 是什么：在线教育 领域 在直播这一块是一种新型的产品形态。 为什么：因为传统的录播课(视频)教学没有比较好的反馈极致能够让学生知道自己的学习情况，而直播更有利于学生接受老师的正向反馈，从而迅速学习成长。 怎么做：里面主要是一些围绕小程序直播，交流，列表等逻辑展开的交互设计，其中部分遵循了微信小程序的交互设计和框架。老师主讲图并非最后上线的效果，后期上线后我们再次对老师的图像、老师的照片，整个对外的形象进行了一些优化和调整。 Client/客户Yunshuxie 云舒写 Time/时间Agust 2020 2020年10月 Industry/行业Online Education 在线教育
交互设计 / UX
ZoomDetails

Vultr 首页重新设计 / Vultr Homepage Redesign

Vultr 首页重新设计 / Vultr Homepage Redesign 是什么：Vultr 是一家国外的在线云服务器提供商，由于之前有使用过他们的产品，也从而和他们结缘。其中和他们的设计师沟通，他们对首页有更新需求。 为什么：原有的在线云服务器提供商仅提供简单的功能，而随着社会的现代化发展，除了要满足用户基本的使用需求，用户也会更在意视觉、交互的细节体验。所以他们选择了升级。 怎么做：首先，我调研了各项云服务厂商的大概感觉，并对它现有的颜色和整体的设计布局进行了优化和调整，让网页看起来非常的超前。由于用户也是男性角色居多，所以绘制场景插图的时候，我们尽可能选用蓝色等相关的感觉颜色惊醒尝试。最终通过体验和视觉表现提升Vultr在整个中小型服务器行业的竞争力。 Client/客户Vultr Time/时间April 2020 2020年04月 Industry/行业Internet Services 互联网服务提供商
其他 / Others
ZoomDetails

[翻译] 编程、美术相关的书籍 / Translation Book

编程类 - 书籍1 《Learning Processing, Second Edition: A Beginner's Guide to Programming Images, Animation, and Interaction》 《学习Processing 第二版本：一个初学者的编程图像、动画和交互指南》 出版于2015年，摩根考夫曼。 564页 原版购买链接 https://www.amazon.com/gp/product/0123944430/ref=as_li_ss_tl?ref_=nav_ya_signin&linkCode=sl1&tag=processing09-20&linkId=fb0eeedd8fb1016a790e83d538a1c030 编程类 - 书籍2 《Programming Interactivity》 《程序的交互性》 https://www.amazon.com/gp/product/144931144X/ref=as_li_ss_tl?ie=UTF8&camp=1789&creative=390957&creativeASIN=144931144X&linkCode=as2&tag=processing09-20https://www.amazon.com/gp/product/0123944430/ref=as_li_ss_tl?ref_=nav_ya_signin&linkCode=sl1&tag=processing09-20&linkId=fb0eeedd8fb1016a790e83d538a1c030 编程类 - 书籍3 《The Nature of Code: Simulating Natural Systems with Processing Published December 2012. PDF, Web, Paperback.》 《代码的本质：通过Processing模拟自然系统》 出版于2012年，包含PDF，Web，和书面装订版本。   原版本购买链接： https://www.amazon.com/Nature-Code-Simulating-Natural-Processing/dp/0985930802/ref=pd_bxgy_img_2/147-0052870-6981943?_encoding=UTF8&pd_rd_i=0985930802&pd_rd_r=63f3d50e-7b9b-49f7-b9be-42a6ffc200e9&pd_rd_w=ngVae&pd_rd_wg=BHwpR&pf_rd_p=ce6c479b-ef53-49a6-845b-bbbf35c28dd3&pf_rd_r=DFNY6FWXNDKW72N8ZE5Y&psc=1&refRID=DFNY6FWXNDKW72N8ZE5Y 美术类 - 书籍1…
设计过程 | Process