要做一个好的UI设计公司,不仅要在能力上设计能力一直（十几年几十年）保持优秀稳定的保持输出，以及心态的平和宽广。创始人对做公司要有信心，合伙人之间要同甘共苦，遵守规则，做好表率。
只要持之以恒做好这些，不断学习。创业其实也不难。
贪嗔痴慢疑，是人性，
善良信任利他尊重包容也是人性，
一个公司能几十年长盛不衰，那不仅仅只是设计能力好的问题。
我们在这个过程中也完成了对自己的修炼。

2.全流程设计包括有什么主要内容和步骤？
1）明确设计目标，聚焦设计要解决的核心问题
2）明确目标用户，要明确产品价值要解决的用户群体，描述用户画像，提炼用户场景，挖掘用户需求。
从产品应用的具体场景，来研究和理解所涉及到的产品体验问题。这些可能是产品中已经出现的体验问题，也可能还包括有未满足的用户需求问题。通过不同的用户研究手段，了解已有的用户行为和使用习惯，进行策略分析，改变原有业务逻辑不合理的操作路径，进而提出有针对性的交互设计和视觉设计解决方案。
3）明确资源配比，了解技术方案，进行设计预估
通过项目启动会了解产品的功能列表和产品规划，避免做出现有功能相冲突/重叠的设计，进行合理的设计预估
4）确定方案流程，确定设计方案
方案流程可以是流程图也可以是交互原型图。最终完成的是高保真的交互原型、可交付开发实现的UI demo。在以最终的结果进行专家评审，确认无误后，进行可用性测试。
5）数据对比分析
在有条件的情况下，需要对于设计前后的数据进行对比分析，对比前流程与现流程的差异，关注某流程的耗时和步骤。大部分B端产品的设计初衷就是为了某业务流程的降本增效。关键就看设计的产品，在上线后给公司的降低了多少的成本，提高了多少的效率。所以成本和效率也是设计的产品是否合格的关键因素所在。B端产品设计可以进行用户可用性测试，了解设计带来的实际收益和效果。依托数据合理改正方案。

前一段时间，有一个客户（甲方主管研发工作的副总）向我提出了这个问题：如何提高公司程序员工程师的UI审美？
他们公司UI设计师只设计其中很小的一部分页面，大部分页面要让程序员自己来做的，程序员开发出的页面看起来总是很丑，这是他觉得苦恼的地方。
在听到这个问题的时候，我很惊讶，觉得这个问题真的是个好问题。我以前关注的都是设计师如何提高自己的审美？没有想过让程序员提高自己的审美。
据我了解，他们公司的程序员非常忙，比我们UI设计公司的加班程度要多很多。我首先想到的是工作都这么辛苦了，能把功能任务完成就很不错了，也许能顾上提升UI设计审美的时间精力有限。
提高审美，不是短期内能够达到的事情，何况术业有专攻，工程师们有没有兴趣和精力做这件事情，也是另外的一个问题。
但是，这是一个很好的问题，在一个软件公司里工程师程序员是占大多数的，UI设计师相对人数比较少的。如果大量的工程师能够把审美提高易用性提高。确实，这个软件的整个UI水准就会提高。
如何提升整体软件的UI设计美的水准，让软件好用又统一？
我首先想到的是制定好的UI规范，做好全流程的交互设计原型。通过核心关键场景，关键页面的梳理，整理出一套设计语言，规定好UI规范。这份工作可以由设计师来做，把所有的字号颜色使用的元素组件都确定好，关键的场景和页面做一些模板，制定一份完善的UI规范，方便工程师按照这些去复用调用，降低难度。

出现原因（Reason）：

电脑，平板，智能手机的屏幕尺寸逐渐多样化，设备类型的增长增强了网页的适配需求。
注：屏幕尺寸为浏览器尺寸的上限

自适应（Responsive）：

自适应是根据设备分辨率的不同，分别为不同的屏幕进行布局定义，创建多个固定布局，即“多套设计，多套开发”。适用于阅读类交互多的网站，如知乎官网。

响应式（Self-adaptive）：

响应式是基于同一套代码、同一套设计语言，能够兼容多尺寸、多终端设备的展示，即“一套设计，一套开发”。 网页根据显示宽度（浏览器宽度）自动调整内容，适用于企业、产品等视觉展示型网站中，信息少图片多，如华为官网。

响应式好处（Advantage）：

开发成本更低，一套代码。
设计成本更低，一套设计。
业务迭代更快，一次运营。

响应式适配原则（Principle）：

拉伸布局：内容在屏幕显示区域进行相对拉伸，已达到完整布局。
等比缩放：内容在屏幕的相对位置上进行等比例缩放，一般用于图片。
扩展布局：内容可灵活按照屏幕尺寸进行增减，扩展为多行多列等。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加蓝小助，微信号:ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢～希望得到建议咨询、商务合作，也请与我们联系01063334945

分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

蓝蓝写
画出用户旅程图是我特别喜欢的一个工作方法，可以与产品、研发、市场团队一起共创，优化产品。
用户旅程图是一种图形化工具，用于详细描述用户在使用产品或服务时所经历的各个阶段和步骤。它能够展示用户的整个使用过程，包括用户的需求、痛点、态度和行为，以及产品或服务如何与用户进行互动。作为产品设计者，我们可以通过用户旅程图更好地理解用户需求，提前发现后续的用户体验问题，并思考如何提升产品或服务的用户体验。
用户旅程图的应用广泛，不仅可以帮助我们进行流程分析，还可以识别痛点，定义问题域。同时，它也可以帮助我们进行用户反馈的收集和整理，为产品或服务的优化提供依据。然而，用户旅程图并不是一种一次性的工具。它需要我们不断地更新和完善，以适应不断变化的市场和用户需求。因此，即使我们所属的团队没有特别完善，也许我们在很长时间内都没有运用的环境，但是不要忘记，它依然是一个威力无比的工具。
现在我们就来重温一下，这是蓝蓝设计的用户旅程图~~~

UI设计公司的用户旅程图

这是乘坐飞机过程的用户旅程图~~~

使用用户旅程图的方法如下：
Step 1：明确用户和划定用户群
首先，我们需要明确研究的目标用户和所属的团队资源情况。在此基础上，我们可以确定需要映射的用户群体，并针对该群体的特定目标和场景进行旅程图的构建。
Step 2：梳理业务场景下用户行为流程
根据目标用户的任务和行为，我们可以梳理出该场景下用户的行为流程。这个流程包括用户需要经历的阶段、环节以及交互方式等。如果涉及主次任务流程，都需要一一梳理出来，并加以归类。这个过程需要深入的剖析，尽可能找出所有用户与软件产品产生交互的接触点，以便进一步拆分出每个阶段的用户目标、操作、接触点位置、用户想法以及用户感受。
Step 3：绘制用户想法和感受曲线
在梳理完用户行为流程之后，我们需要根据调研时记录的用户反馈和情感变化，绘制出用户的想法和感受曲线。这个曲线通常采用情绪曲线的形式来展示用户的情感变化，并标注出用户的痛点和爽点。
为了获取用户数据，我们采用了多元化的数据收集方法，例如：
用户行为观察：直接观察并记录用户在各个阶段中的实际操作行为。
用户测试：通过测试用例执行，评估用户在特定任务中的操作效率、反复性以及清晰度。
用户调查：以问卷或在线访谈的形式，收集用户对于任务完成情况的反馈以及他们的疑问和不满。
热图分析：通过热图工具分析用户在界面上的鼠标移动和点击行为，以评估操作的顺畅程度。
工单与客服反馈：收集并分析用户通过工单或客服途径反馈的问题和意见。
这些数据均应直接来源于真实的用户行为和反馈，而不是团队内部的推测或分析。在整理数据时，我们需要避免主观评价和情绪化的表达，坚持以客观事实为基础，并关注以下几类关键数据：
用户实际操作过程：观察并记录用户在各个阶段的具体操作步骤。
操作效率：通过测试数据评估用户完成特定任务的效率。
操作的反复性：记录用户在操作过程中重复操作的次数和频率。
操作过程的清晰度：通过用户调查或热图分析，了解用户对于当前操作流程的清晰程度和满意度。
任务完成情况：根据用户调查和工单反馈，统计任务完成率以及未完成的原因。
用户疑问：整理并分析用户在各个阶段中遇到的疑问和困惑。
用户不满：收集并分析用户对产品或服务的不满和抱怨。
用户情绪：通过工单、在线访谈或社交媒体分析，了解用户对产品或服务的情绪反应。
Step 4：总结解决方案和新的灵感切入点
在对这些数据进行痛点分析时，我们需要对这些痛点进行系统的梳理、分级以及深度挖掘，以洞察痛点背后用户的真实需求和期望。然后，基于这些痛点和需求，识别出产品或服务优化和改进的关键机会点。

通过回答这些问题，我们可以总结出相应的解决方案和新的灵感切入点，为产品或服务的优化提供参考。
在分析过程中，我们可以采用多种方法来拓宽思路和寻找可能的改进点，例如：
行业内成功做法借鉴：研究同行业其他成功案例，了解他们在解决类似问题时的策略和方法。
项目经验总结：回顾团队历史项目中的类似问题，提炼成功和失败的经验，以便应用于当前问题的解决。
专业判断与经验联想：依靠专业知识和行业经验，提出可能的问题解决方案，并联想类似场景中可能的优化策略。
用户视角思考：换位思考，从用户角度出发，尝试理解他们可能的痛点和需求，以及可能的解决方案。
头脑风暴：组织团队成员进行头脑风暴，鼓励发散性思维，尽可能多地提出可能的解决方案。

我们的目标并非仅仅是为了制作一张漂亮的图形或者报告，而是通过这种结构化的分析方法，尽可能客观地找出产品或服务中用户体验优化的关键机会点，以便为进一步的决策和实施提供明确的方向和依据。通过绘制图表，我们可以清晰地展示整个分析过程以及结果，提供一种可视化的视角以便团队成员更好地理解和评估产品的优势与不足。
多练习~~这是一个很有效的积思广议、从多角度解决问题的一个好方法。
祝大家使用顺利~~

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加蓝小助，微信号:ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢～希望得到建议咨询、商务合作，也请与我们联系01063334945

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

改版前

改版后

页面框架

1.导航菜单

用于承载同一层级下不同页面或类别的组件，方便用户在同一个页面框架下进行快速切换。

1.1.颜色

导航层和内容层划分明确，从本质上讲，这两个本身就属于不同的业务模块，通过颜色的区分，是最为直接，最简单的一种方式。左侧导航为深色，能够让用户更沉浸的体验，右侧内容区都为浅色，用户在使用时能够真正做到有区分。

1.2.侧边导航

将菜单栏放置在左侧，页面布局上为左右结构，将导航菜单放置左侧固定
优点：
扩展性较强（多级导航可以流畅展示，可以涵盖很多大而全的产品）
展示灵活（侧边导 航可收折，收折过后用户的横向核心空间将会增大大，页面展示效率也会大大提高）
快速定位（视觉启始线统一，用户可以根据首字进行查找，方便查找）

1.3.图标

线性图标是由直线、曲线、点在内等元素组合而成的图标样式，通过线来塑造轮廓。线性图标具有辨识度高，清晰，简约易识别等优点，不会对页面造成太多的视觉干扰。

2.树结构

用于承载有父子关系的结构化内容，提供内容层级的展示。

2.1.组织信息

树形结构可以帮助将信息进行层级分类，清晰地展现出信息之间的从属关系。这样，用户可以快速找到所需内容，降低了在应用中迷失的可能性。

2.2.帮助用户导航

在一个页面上展示多个层级的内容，用户通过点击展开或折叠相关节点，无需频繁地跳转页面。这种设计简化了导航过程，提高了用户满意度和黏性。

2.3.左树右表

根据人的视线流和操作顺序，将树结构放置在表格左侧，先帮助用户定义表格的具体内容，后引导用户进行表格内的操作

3.表格

表格常用于展示同类结构下的多种数据，易于组织、对比和分析等，并可对数据进行搜索、筛选、排序等操作。一般包括表头、数据行和表尾三部分

3.1.斑马纹表格

斑马纹表格通过交替的数据行背景，可以引导用户的视线，使得大量数据看起来更加和谐和有条理。这使得用户能够更快地找到他们需要的信息，提高了数据的可读性和扫描性。同时可以减少视觉噪音和协助对比，从而帮助用户更加轻松地浏览表格数据，降低视觉疲劳。

3.2.居中对齐

居中对齐的文字和数据在视觉上更加均匀分布，可以让用户更加轻松地浏览和读取数据。特别是在处理包含大量数据的表格时，居中对齐能够减少视觉上的拥堵感，提高数据可读性。可以使整个表格的行高参差不齐的现象得到缓解，给用户一种视觉上的统一感。

3.3.颜色

品牌色用于选中和编辑，红色用于警示和禁止操作，绿色用于积极意义的信息或者操作。控制颜色数量，且不同颜色表达不同的含义，符合用户思维惯性，具有良好的反馈作用。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加蓝小助，微信号:ben_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢～希望得到建议咨询、商务合作，也请与我们联系01063334945

分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司

蓝蓝未来将会持续在平台上分享关于设计行业的文章。此外蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，添加vx蓝小助ben_lanlan，报下信息，蓝小助会请您入群。同时添加蓝小助我们将会为您提供优秀的设计案例和设计素材等，欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。

banner插画组件化设计—效率提升篇
李瑞昊

插画在互联网行业设计中有着大量地运用，合理地使用插画不仅能够增强视觉感染力，塑造品牌认知，而且可以提高用户活跃度和活动转化率。组件化设计可以解决插画风格不统一以及设计产出效率低，缺少情感化设计等因素。

[
(http://www.lanlanwork.com/blog/content/uploadfile/202308/e7181692615358.png)]

(http://www.lanlanwork.com/blog/content/uploadfile/202308/982b1692615532.jpg)

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加微信ban_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~

希望得到建议咨询、商务合作，也请与我们联系01063334945。 



分享此文一切功德，皆悉回向给文章原作者及众读者. 免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。 



蓝蓝设计( www.lanlanwork.com )兰亭妙微，是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司。

科研信息软件是现代科学研究中必不可少的工具之一，它可以帮助科研工作者管理数据、分析结果、展示实验图像和文本信息等。在今天这个信息化时代，科研信息软件的UI设计也变得越来越重要，因此本文将以科研信息软件的UI设计为题，探讨如何设计出合理、易用、美观的科研信息软件界面。

一、UI设计的基本原则

在进行科研信息软件的UI设计时，我们需要遵循一些基本原则，以确保设计出用户满意、易用、美观的软件界面。以下是一些重要的UI设计原则：

1. 简洁明了：科研信息软件应注重界面简洁明了，以避免用户过多的学习成本。应尽可能地减少功能按钮和控件的数量，并将其分组或分类，以便于用户快速找到所需要的工具。

2. 可用性：科研信息软件应该非常注重可用性，确保用户能够轻松、快速地完成任务。为此，可以引入一些常用的设计元素，例如列表、表格、搜索框等，同时在设计时，需要考虑各种用户操作情况，如单击、双击、右键单击等。

3. 色彩搭配：在科研信息软件的UI设计中，色彩的搭配非常重要。应该选择适合目标用户和应用场景的主题色系，并在设计过程中使用这些颜色。此外，颜色还可以用来强调某些重要元素，例如按钮、链接等。

4. 风格风貌：科研信息软件可以根据不同的使用情境，采取不同的界面风格和风貌。比如，可以采用类似Windows的传统桌面风格，也可以采用时尚现代的扁平化、材料化设计风格。

二、设计要素与功能模块

在进行科研信息软件的UI设计时，需要考虑一些重要的设计要素和功能模块，以下是一些常见的设计要素和功能模块：

1. 导航栏：在软件界面的顶部或侧边，应该设置一个清晰明了的导航栏，以便于用户快速找到所需工具或信息。

2. 设置区：在设置区，用户可以对软件进行设置、管理各种数据源、安排任务等操作。在设计设置区域时，需要关注易用性和可维护性，给用户提供方便的界面指引，以便于他们快速掌握设置流程。

3. 数据管理：科研信息软件的主要目标是管理各种数据类型，包括实验数据、分析结果、文献资料等。在设计数据管理模块时，需要考虑数据类型、数量和结构，并采用适当的界面元素，例如列表、表格、树形结构等。

4. 数据可视化：数据可视化是科研信息软件中非常重要的功能之一，它可以帮助用户更好地理解和分析数据，支持图表、曲线、热图等多种可视化方式。在设计数据可视化界面时，需要优化数据展示效果，提高易读性和易用性。同时，在数据可视化模块中应该支持用户自定义的操作，例如选择数据源、调整参数设置等。

5. 工具箱：工具箱是科研信息软件中非常常用的功能区域，它提供了丰富的工具和模板，以支持用户的不同操作需求。在设计工具箱时，需要尽可能地精简和分类，使用户能够快速找到所需的功能工具。

三、UI设计的最佳实践

在进行科研信息软件的UI设计时，还需要遵循一些最佳实践，以确保设计出更好的用户体验：

1. 用户测试：在设计完成后，需要进行用户测试和反馈，以确认设计是否符合用户需求。测试可以采用问卷调查、用户访谈、焦点小组等方式。

2. 设计原型：在开始UI设计之前，需要定义界面的功能和流程，并制作出初步的草图或原型，以建立一个基本的设计框架。原型可以通过 用户体验设计工具 如Axure、Sketch、figma等绘制。

3. 反馈和改进：根据用户的反馈，进行适当的改进和调整，以提高用户体验和界面易用性。

4. 框架和插件：使用流行的UI框架和插件，以加速设计过程并提高界面风格的一致性。Vue、React等都是比较受欢迎的前端框架，利用这些框架可以减少开发时间和代码量，提高可维护性。

总之，科研信息软件的UI设计需要注意众多细节，应注重用户的需求和使用体验，并遵循一些基本原则和最佳实践，才能设计出合理、易用、美观的软件界面，提高科研数据管理、分析和展示的效率和质量。

蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请加微信ban_lanlan，报下信息，蓝小助会请您入群。欢迎您加入噢~~

希望得到建议咨询、商务合作，也请与我们联系01063334945。 



分享此文一切功德，皆悉回向给文章原作者及众读者. 免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。 



蓝蓝设计( www.lanlanwork.com )兰亭妙微，是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司。