关于设计中的组件化思维

2022-4-5    纯纯

组件化思维对于一个设计师来说十分重要,它能够帮助你更好的去进行产品的设计,那么组件化思维对于设计者都起到什么作用?

1.符合产品功能逻辑,组件化的设计理念能帮助设计符合产品功能逻辑。

 

2.有助于保持交互一致性,在一个项目里,选择日期应该是统一的交互方式,在整个产品中就应该只有一种存在形式。所以时间选择器就是一个组件,一个可以复用的组件,如果你没有组件化思维,很可能出现好几个不同的时间选择器,一会儿是流轮拨盘,一会儿是日历,一会儿又是下拉列表,这样的设计绝对是不能上线的。当然该统一的地方还有很多,比如:错误提示的形式,讲度条的交互方式,导航栏和按钮的样式。表单,下拉菜单等等。

 

3.减少开发工程师的工作量,开发时使用不同的技术,了解不同技术之间的差异,设计时按照每个开发软件的组件来做设计极大的减少了开发的时间.

 

4.保持视觉风格的统一,在同个项目不同页面按钮等组件的样式上应该保持统一。

 

5.便于多设计师协作组件化设计是大型设计项目的必要条件,多人协作完成项目时,应当保持视觉统一规范,组件化建立就起到了至关重要的作用。

 

6.便于修改设计,设计总是需要修改优化的,只需要根据需求调整需要调整组件即可。

 

针对各种组件的开发软件做了以下介绍,欢迎在评论区进行补充与探讨!

 

echarts
 帮助各行业进数据处理以及分析,一键生成饼图,柱状图,甘特图,折线图等多种图表;简道云的图表分析

 

各种图示效果样式案例可供设计者参考

 

https://echarts.apache.org/examples/zh/index.html#chart-type-line

 


Ant Design

ant通过模块化解决方案,降低冗余的生产成本,让设计者专注于更好的用户体验,规范设计的设计思维,有丰富的设计资源与组件,对设计样式的表达起到非常好的参考作用

https://ant.design/index-cn

 

Element

Ant Design稍加相似,可供设计者作为辅助参考

 

https://element.eleme.cn/#/zh-CN/guide/design

 

 

另外其它的开发工具:

React是用于构建用户界面的JavaScript库,起源于Facebook的内部项目

 

Hook 可以中文译为“挂钩”或者“钩子”,逆向开发中改变程序运行的一种技术,在逆向开发中是指改变程序运行流程的技术,通过Hook在别人的程序中。需要了解其Hook原理,这样就能够对恶意代码攻击进行有效的防护

 

 

Umi 是一个可插拔的企业级 react 应用框架。 插件化 umi 的整个生命周期都是插件化的,甚至其内部实现就是由大量插件组成

 

 可扩展 Umi 实现了完整的生命周期,并使其插件化,Umi 内部功能也全由插件完成。此外还支持插件和插件集,以满足功能和垂直

 

Vue 有两大特点:响应式编程、组件化。其优势为:轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟DOM、运行速度快。

vue是单页面应用,使页面局部刷新,不用每次跳转页面都要请求所有数据和dom,这样大大加快了访问速度和提升用户体验。它的第三方ui库很多节省开发时间。https://cn.vuejs.org/v2/guide/index.html

 

 

vue是我们的常用框架,大多数客户的选择。ant➕react➕hook➕umi,中后台这个也比较多,最近的项web端的基本上是这两种选型。

其它常设计有wpf/qt/mfc/开发,在c++c#下运行的客户端程序

 

 

其它例如:

Bootstrap Twitter推出的一个用于前端开发的开源工具包。是基于 HTMLCSSJAVASCRIPT ,它简洁灵活,使得 Web 开发更加快捷

https://getbootstrap.com/docs/5.1/examples/


developermaterial汇聚了ios、安卓组件框架及人机交互指南,相关链接:

https://developer.apple.com/design/human-interface-guidelines/ios/overview/themes/

https://developer.android.google.cn/docs/quality-guidelines/core-app-quality

https://material.io/components?platform=android

 

蓝蓝设计——    作者:纯纯

分享此文一切功德,皆悉回向给文章原作者及众读者.

免责声明:蓝蓝设计尊重原作者,文章的版权归原作者。如涉及版权问题,请及时与我们取得联系,我们立即更正或删除。

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

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档