高效打造B端作品集的设计思路

用户头像
上海/设计爱好者/183天前/5989浏览
高效打造B端作品集的设计思路
今天对B端作品集的项目应该怎么展示和包装做次更新,来分享应该如何正确、有效的完成对作品集的输出。
项目作品集包装的基本结构
项目作品集包装,就是用一种更合理、更能被接受的方式,来展示我们的设计方案。这里有个默认的前提,就是直接把界面堆一起展示出来,是不行的,是不被市场认可的。
因为B端界面本身视觉样式的上限就不高,而且信息又密集功能又难懂,光看一套界面图例往往 —— 既没设计看点又看不懂,没人想看这样成套堆积起来的B端界面图。换你你也不想看这样的设计案例。
高效打造B端作品集的设计思路(图ZMTUyODEzMzY=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
所以项目肯定要换种形式展示,且光展示图也不够,因为B端界面的复杂性导致外人很难理解,即看不懂这是什么项目,又不明白这些界面有什么用。于是,为项目的展示添加文字说明也就有了必要性,比如添加项目说明,再依次补充页面说明、功能说明、操作说明等。
但这种基础说明方式只是流水账,它们与其说是项目说明更不如说是简化的 ——
产品说明书
。所以问自己一个简单的问题:
你喜欢看产品说明书吗
高效打造B端作品集的设计思路(图ZMTUyODEzNDA=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
不想做成产品说明书,且B端界面视觉也没有太多能讲的,所以项目包装想要吸引人,就要围绕设计的核心价值点去开展,即 ——
设计解决了什么问题
所有商业设计项目本质上都是基于商业目标开展的商业活动,所以设计的核心价值就是满足商业的诉求。所以最好的项目展示方式,就是解释你得设计产生了什么样的价值,解决了哪些问题。
比如一个原本用起来非常别扭的产品要重构,你能不能做出让操作者用起来更顺手的新全局框架。一个需要高频操作的复杂的采购申请流程,你能不能根据需求大幅度优化交互步骤和界面引导提高操作效率。
高效打造B端作品集的设计思路(图ZMTUyODEzNDQ=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
在一个正式项目中,为了实现这样的设计目标,就肯定会搭建一个对应的工作流程,而不是听一遍产品(老板)的需求以后继续打开设计Figma做图。
如果我们把B端设计项目按一个比较完成的流程整理下来,就包含 “计划” 和 “实施” 两个模块。每个模块下还会包含若干的工作节点,分别解决不同的问题,为后续的工作提供提供提供准备和依据。
高效打造B端作品集的设计思路(图ZMTUyODEzNDg=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
所以展示最合理的方式,就是去还原这个流程,解释项目本身的需求是什么,
你是怎么分析并确定设计方案,以及完成最终设计结果的
。这是作为招聘方、面试者最喜欢也最想看到的内容,因为企业招聘找你来就是让你用设计去解决他们想要的结果,而不是仅让你把图做出来而已。
同时这也是面试必问的问题,让你介绍项目和设计的思路,如果你的回答只是停留在视觉上的考虑或理论解释,基本是不会获得好的评价的。
相信这部分逻辑很好理解,那么我们来面对一个更重要的问题,
要是你自己的项目就没那么执行随便应付,或是你没工作经验项目是改版或模拟的,那项目包装不就没东西写
这就需要我们自己“编”出来了,即建立一个包装的内容框架,再根据这个框架来填充里面的内容。当然,这个过程不是胡编乱造,而是根据自己的分析重新把这个流程 “补充” 一遍,去建立一套有逻辑性的包装内容。
而这就要进入大我们下个章节的解释。
项目包装的结构定义
到这个阶段,我们就要组织项目的具体包装内容和结构了。项目包装之所以叫包装,因为它
不是纯粹做虚假的美化,而是要有目的性的控制对一个项目的展示内容
所以不是往里面堆越多内容越好,因为专业的设计过程中可以写得东西太多了,全写即没必要也没人想看,所以我们往里面添加内容一定要够精简、有足够的必要性。要完成这个步骤就先确定展示的主要模块有哪些,然后再进一步细化。
虽然不同项目会有很大的差异,但大体上我们可以遵循下面这样的结构来完成(仅供参考你们要自己做调整和增减):
  • 项目封面
  • 项目介绍
  • 业务说明
  • 设计目标/问题
  • 用户/体验分析
  • 风格定义
  • 界面展示
  • 结束页
有了模块的结构,那么下一步就是编写文案内容(自己用文档工具写),完成后再将图文置入画布中进行最后的排版设计并输出。下面我们简单介绍下不同节点之间的内容都有哪些。
封面和结束页
首先封面和结束页是最基本的页面类型,它们存在的价值是为了区分作品集之间不同的项目,所以尤其是封面的设计,可以不需要添加很多文字信息但项目名一定要醒目,视觉要突出,才能让观看者很轻易的识别要开始浏览新的项目。
高效打造B端作品集的设计思路(图ZMTUyODEzNTI=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
项目介绍
项目介绍就是简单说明这个项目、产品是什么,以及项目的目标有哪些。让观看者进入状态,对项目有个起码的认识,以及清楚你设计针对的问题是什么。
高效打造B端作品集的设计思路(图ZMTUyODEzNTY=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
高效打造B端作品集的设计思路(图ZMTUyODEzNjA=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
业务说明
业务说明就是根据你的理解对项目面向的核心业务进行说明,可以展示的是业务架构图也可以是业务流程图。作用是展示自己对产品业务的熟悉程度,而不是指望观看者真的完全看懂。
如果产品包含的业务非常多且复杂,那么就要自己确认出核心的业务模块出来,尤其是后续设计中展示的部分,而不是单纯为了凑字数添加大量的业务说明但和后续设计没有任何联系。
高效打造B端作品集的设计思路(图ZMTUyODEzNjQ=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
设计目标/问题
有项目的基本要求和对业务的理解,就会引出进一步设计的方向,如设计目标上要更换全局框架、搭建组件库、优化操作流程等等。如果是改版项目,也可以提供原有项目设计中存在的缺陷有哪些,而设计的目标就是优化这些问题。
高效打造B端作品集的设计思路(图ZMTUyODEzNjg=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
用户/体验分析
用户体验分析可以包含好几个阶段和步骤,看自己怎么发散,核心是对项目操作对象或产品体验的要点做总结,比如原用户对产品哪些操作不满意的信息收集,或是你自己发现的产品体验待优化的空间有哪些。
要注意B端和C端不一样,用户的分析最好是直接沟通访谈收集的反馈,而不需要大规模测试和实验(就没那么多用户),用户群体不是非常特殊也不用整用户画像出来。只要他们的诉求和反馈足够有说服力即可。
高效打造B端作品集的设计思路(图ZMTUyODEzNzI=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
风格定义
这里就是展示行成项目视觉风格的主要思路和规范,包括情绪版的定义,以及设计规范和组件库的展示。规范展示建议可以直接展示软件中创建的规范信息,而不是就随便丢一点字体、色彩、组件上去,看起来会非常的糊弄。
高效打造B端作品集的设计思路(图ZMTUyODEzNzY=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
高效打造B端作品集的设计思路(图ZMTUyODEzODA=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
界面展示
最后一个,就是对完成的页面进行具体的展示了。展示页面有两种不同的展示模式,一种是围绕单一页面做展示,解释它的框架、功能点设计思路,另一种是围绕模块、流程的多页面展示,更重点去解释流程和交互的设计思路。
一个有节奏的页面展示过程最好是能混合这两种形式,让下方的页面展示效果能更丰富和多元,而不是变成流水账看过去。而合适的页面展示数量在20页上下,至少有3-5个关键单页,以及2-3个核心流程的展示。
高效打造B端作品集的设计思路(图ZMTUyODEzODg=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
高效打造B端作品集的设计思路(图ZMTUyODEzOTI=) - 教程 - 站酷设计师酸梅干超人原创素材 - 站酷ZCOOL
收藏
对界面的说明一定要尽可能围绕前面分析涉及到的问题开展,而不是每个页面各解释各的,和前后毫无联系。
到这里一个作品集项目的包装内容就完成了,不同的项目当然可以输出不同的包装,但本质上就是你得给它定一个类似写作的输出的顺序(大纲),然后跟着这个流程推进。这样不仅做起来会更有效率,后续进行项目解释的时候也可以更清晰、更从容一点。
结尾
最后还有一点,B端作品集不用做的非常的花哨,清晰的排版和舒适的视觉,加上合理的文本与逻辑,就可以构成一套非常专业优秀的作品集。
我们下篇再贱~
90
举报
|
200
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
加载中
推荐素材
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
新能源APP应用UIKit
Security Camera UI kit
我的钱包-UI界面设计-app
【新年UI图标】珠宝icon
【新年UI图标】汽车icon
高级表盘系列UI源文件
新拟态风格 UI设计组件库
【新年UI图标】银行卡icon
【新年UI图标】秒杀icon
3D渐变流体抽象矢量UI背景图
拟物风质感写实UI卡片合集源文件
UI应用平面图标
手表表盘UI系列
高级感金属拟物 UI设计组件库
抽象液态渐变UI背景模版
【新年UI图标】影音icon
钱包ui模板
3D卡通UI界面图标可爱插画免扣素
【新年UI图标】30个图标
科技医疗透明柜UI界面设计
智能家居中心 简约 UI设计组件库
UI通用设计素材1
你可能喜欢
相关收藏夹
技
技
技
技
10
大家都在看
登录注册