大前端如何降本增效

现在很多互联网公司都在降本增效,如何提升软件开发的效率就成了公司的一大问题,我作为一线开发人员,在我司任职的这些年总结到影响软件开发效率的主要有以下几点:需求变更、UI走查、bug修改,真正进行coding的时间其实并不多,解决这些问题的关键就是规范,软件开发链条上的所有角色都要遵守各自的规范。

一、产品规范

产品规范不好弄,原因在于产品是从0到1的创造阶段,创造就不能有太多的条条框框,就要综合各方面的需求,但是我们可以对产品的交付做要求,即交付后禁止修改主体逻辑,旁支逻辑修改不能超过N次,如果触发这两个条件则打回重写

二、UI规范

无论是陈年项目还是新开项目,如果想在后期的更新迭代中高效、准确的进行UI开发,就必须要有一套UI规范,这套规范需要设计师和开发一起完成。下面是我这些年做UI规范的一些简单总结,可以作为参考思路

1:颜色:设计通用颜色库,要兼容正常模式和深色模式;比如text_primary,正常颜色是#141414,深色模式下是#FFFFFF;bg_primary,正常模式为#F5F5F5,深色模式为#000000

2:间距:设计通用间距库,比如按钮中内容的左右间距、上下间距;列表卡片的左右内边距等

3:字号:设计通用字号库,比如tv_28,下面以安卓为例,values.xml文件的代码

<style name="tv_28" parent="text_base" ns1:ignore="ResourceName">
    <item name="android:textSize">@dimen/dp_28</item>
    <item name="android:lineSpacingMultiplier">0</item>
    <item name="android:lineSpacingExtra">@dimen/dp_36</item>
</style>
<style name="text_base" ns1:ignore="ResourceName">
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:includeFontPadding">false</item>
    <item name="android:gravity">left|center_vertical</item>
</style>

4:根据颜色、字号、间距就可以设计出通用的按钮背景库,以安卓为例

<style name="button_H22_text_art" parent="button_H22" tools:ignore="ResourceName">
    <item name="android:minWidth">@dimen/dp_58</item>
    <item name="android:background">@drawable/selector_button_text_art</item>
    <item name="android:textColor">@color/selector_button_text_art</item>
</style>
<style name="button_H22" parent="button_base" tools:ignore="ResourceName">
    <item name="android:layout_height">@dimen/dp_22</item>
    <item name="android:minHeight">@dimen/dp_22</item>
    <item name="android:paddingLeft">@dimen/dp_8</item>
    <item name="android:paddingRight">@dimen/dp_8</item>
    <item name="android:textSize">@dimen/xxxxs</item>
    <item name="android:minWidth">@dimen/dp_49</item>
    <item name="loadingSize">small</item>
</style>
<style name="button_base" parent="text_base" tools:ignore="ResourceName">
    <item name="android:gravity">center</item>
</style>

5:有了字号、颜色、间距、背景这些基础规范,就可以对公共组件进行开发和完善:开发没有的公共组件,完善已有的公共组件。比如:价格、输入框、空页面、无网络、服务器异常、标签、文字、按钮、分割线等。对于组件的要求举例:文字组件可以自定义文字大小、文字颜色;按钮组件可以按规范设置圆角、内置通用的内间距、可以设置通用的背景色等

6:每个端根据自己的代码特性开发出名称一样的UI组件,比如button_H22_text_art,代表按钮、高度22、按钮文字颜色为text_art;再比如button_H22_fill_light_red,代表按钮、高度22、完全填充、背景色为light_red,按钮的背景色对应特应的文字颜色

7:开发人员在进行UI开发时,要根据上述规范开发,禁止在页面中写死字号、字色、字重、背景色等

8:开发统一的iconfont库,用来替换图片

9:可以将上述规范做成开发skill和验收skill,在AI开发时直接读取skill进行开发,开发完成后通过验收skill进行验收并给出验收报告

10:通过上述手段,可以大幅减少设计人员对UI的验收时间,提高效率

三、代码规范

无论是陈年项目还是新开项目,如果想在后期的更新迭代中高效、准确的进行代码开发,就必须解决代码不断增加过程中产生的各种不统一问题,比如基类不统一,网络库不统一等,下面是我列举的常见的需要统一的地方

1:只保留一套网络框架,删除冗余框架

2:只保留一套基类,删除冗余基类

3:只保留一套功能相同的工具类,删除冗余工具类

4:统一页面架构,用MVVM就都用,不要MVVM、MVP等来回穿插

5:进行代码拆分,底层下沉,业务层上浮,UI规范库、自定义组件库、网络库、基类库等都单独抽离成组件

6:将代码研发规范做成skill,使用AI开发功能时直接读取skill,提升AI开发效率和开发准确性

四、运用AI

在工作中使用AI之前,必须先开发各种skill,比如UI skill,代码规范skill,当skill完善之后产品运用AI输出PRD文档,设计运用AI输出高保真原型(这时就可以不用输出设计稿了,原型就是设计稿),开发将高保真原型的代码转成各端的代码(GPT-6 Astra 的Product Design插件输出的高保真原型的代码是RN代码),这样UI的开发基本就完成了,再开发逻辑即可。

测试人员可以通过AI输出测试文档,将测试文档转给前后端开发,开发人员用AI完成自测并修改bug,自测完成后交由测试人员进行验收。

最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容