1.4 Design System - 做的优先顺序、注意事项

职场好同学 CH
CH 是之前一起准备升学的同学,但比我早好几年进入职场,本身也是 UX/UI 设计师
因为公司目前尚未有设计部门、我经验也浅,所以职场遇到问题基本上他会是第一个被我打扰的人
在他身上我看到对设计的坚持跟强迫症,但他的产出一直都让我觉得很佩服
对我来说,职场上就是需要有个同领域的榜样,让你未来想成为的样子有个方向,他大概就是那样的存在
也很感谢他在教我的时候,总是很有耐心

之前有提到,跟我说公司若暂时无自有产品的情况下可以先以专案需求做 Guidelines 或公司常用的 Logo 的同辈。这人就是 CH,也因为这样我试着先以 Guidelines 下手,实验过後有几个注意事项想分享给大家参考看看

之前我一直很好奇,究竟其他设计师做 Guidelines 的实际顺序到底是如何?
因为线上资料通常都只找到完成品,但不知道过程,一开始我想:「应该是等画面都定稿後,才会做整理吧!」。不过实际发现,有蛮多重复利用的元件,每次都重新做一样的事有点浪费时间。

专案实际情况也有可能在等待客户确认定稿期先让开发做一点变动不大的项目、也有可能都快要定稿了设计风格大翻盘。那先整理起来,有可能在设计风格大翻盘时,依然要重新调整;或是,等待期太长,若不先整理,等回覆後再整理会压缩後续开发的时间。总之,产品开发的路上,各种可能都有,我实验过两种方式,最後选择了折衷的方法。

实验方法一:所有画面完成後、客户回覆前,先整理再微调
这个就怕遇到设计风格大改,所有页面都需要微调、Guidelines也要同步微调。不过正常情况下,大部分的专案应该都是定稿後设计风格不会有大方向的变动,因为画面设计开始前就会跟客户确认过了!比较担心是客户选择设计风格後,因为组织结构中的上级想法不同或其他原因影响了原本决定的设计风格而需要调整。

而设计上的调整就像整个设计系统一样,是牵一发、动全身的,所以如果你不是设计师或工程师,千万不要说出:「帮我调一下这个,应该很快不花多少时间吧!」这类的话

实验方法二:先建立重复使用的元件,再像组积木一样逐步设计画面
在实验一遇到风格大调整的情况下,我尝试了先做元件,但实际在专案实行的过程中发现,先做重复使用的元件可能发生一个更耗时的状况:组合起来画面不太协调,所以会在画面上调整後,为了要同步 Guidelines 而来回调整。

实验二也不是最好的方式,後来我请教资深一点的同事,他告诉我以他的经验是这样做的
折衷:先挑几个主要的画面做,觉得画面设计是协调以後,再将几个元件建立在 Guidelines 上,逐步增加、整理

那如果遇到有自有产品的公司要做呢?要从哪开始?
我目前还没有这方面的经验,但我想如果是我的话,会这样做
1. 跟各部门几位同事大概提一下构想,先初步了解他们看法
2. 了解一下各部门常用的项目或未来计画需要用到的项目可能有哪些、使用的优先顺序
3. 谘询一下工程师跟设计师如果要做这些项目的话,在 [全力投入] & [专案以外时间额外投入] 的两种情况下,大概会需要多少时程

相信跟大家讨论後会比较清楚,什麽是对公司目前最好的方式,通常在讨论过程中,也会发现有哪些应该注意的地方


实务上的工作经验小故事

因为公司组织扁平化的关系,跟同事或老板之间的相处一直都比较像朋友一样
公司基本上都会有 1-1 跟老板的会议,可以聊聊目前专案的情况、遇到的问题跟改善建议
虽然有时候因为专案需要加班,但 1-1 过程中可以感觉到老板是很注重员工健康的、也不鼓励加班,只是创业有创业道路上的辛苦跟无奈

从跟老板的互动过程中,我慢慢学会以老板的视角看整事情
比如说,新创会把握住每个可能的机会,有时候不是真的要员工加班,公司得好、员工才会好,其实员工在辛苦的时候,老板们的辛苦可能会多一倍。

做事不分大小,在设计圈应该蛮多设计师不喜欢被当作美工,但其实有时候公司计画或专案执行上就是很难切分得这麽清楚,为了让专案或计画顺利进行,PM 或 设计师主要工作当然会是集中在产品策略、体验跟设计上,但也不用排斥做些被定义为「美工」的工作,有可能做这些事对公司的影响是很大的。举例来说,之前实习曾有经验一整天都在找同性质的 App画面、没有负责主要的产品设计,但也因为这样,让我累积了很多画面资料库、也节省了同事搜集资料的时间让整个时程能够如最初的安排顺利进行。

若你看完有任何经验想跟我分享,都欢迎你留言或 Linkedin 私讯我!Day 5 End


<<:  [Day05] 第五章- 初探金流API文件-4(IV,加密msg透过nodejs实作)

>>:  Day6 建立 Next.js 专案 - 使用 create-next-app

电子工作日志纪录的重要性

上一篇讲到离职时整理档案的重要,相对的每个人的工作日志或工作排程,也是个人的保命符,一定要写得清楚明...

Flutter基础介绍与实作-Day2 Flutter的安装流程和环境配置

今天来介绍一下Flutter的环境安装流程 下载Flutter(Windows) 1.到这个网站请点...

IOS、Python自学心得30天 Day-10 模组训练改善-2

前言: 储存上次进度训练模组後,目前遇到一个小问题,载入方面一直没试成功,所以我先做了一个辨别模型的...

[DAY 13] _ADXL345_I2C时序说明 (ADXL345)

今天我就来讲用逻辑分析仪来看I2C的时序吧,我觉得在学习阶段有台逻辑分析仪是很方便的,可以快速查看那...

[Day 22] 计算属性computed趴搭搭

嗨各位!!!又是我,那个小可爱又来了,今天要来讲的是—计算属性,如果你的模板需要加入很多逻辑运算,可...