count() > 0) { return; } \DB::table('file_contents')->insert(array ( 0 => array ( 'id' => 2, 'content' => $this->getContent(2), 'fid' => 2, 'text' => '设计规范的目标 在搭建设计系统之前，我们要想清楚设计规范的目标是什么？使用者是谁？ 目标：保持产品风格统一性、提高设计输出效率、减少无效沟通。 使用人群：UI、交互、前端、测试。   设计原则 设计规范要符合基本的设计原则，否则你的规范会杂乱无章。这里我总结了 6 条原则供大家参考。   Unity（统一性）：页面风格、色彩、布局等要保持全局统一，不可为了某一功能的美观而去破坏整体性。 Accessibility（易用性）：易用是首要考虑的因素，能一步解决的事情绝不两步。 Proximity（亲密性）：如果信息的关联性强，则他们的距离就要相应的缩短，让他们看起来是一个视觉单元；反之，则距离要加大。要让用户对信息的区域划分一目了然。 Alignment（对齐原则）：在界面中，将元素进行对齐，即符合用户的认知，也可以引导视觉流向，让用户更加流畅的阅读信息。 Contrast（对比原则）：对比是增加视觉效果最有效方法之一，同时也能在不同元素之间建立一种有组织的层次结构，让用户快速识别关键信息。 Repetition（重复原则）：相同的元素在整个界面中不断重复，不仅可以有效降低用户的学习成本，也可以帮助用户识别出这些元素之间的关联性。 框架布局 这里一般采用栅格布局。说到栅格，有好多小伙伴又要再回顾一下知识点了。我今天再把栅格知识帮大家复习一遍，如果之前不是很了解栅格的，拿个小本本记下来，要考~~ 栅格布局能够适应各种屏幕尺寸及分辨率，确保整体布局的一致性。 栅格建议使用 1、2、3、4、6 切分布局，可以进行多种布局组合，并在整个设计中保持布局的结构的一致性。   页面中一般采用 24 列自适应网格，你可以使用它为各种屏幕尺寸创建灵活的布局。   边距 Margins、列 Columns、间隔 Gutters 分别是什么？   边距 Margins：边距是内容与左右边缘之间的空间。控制台内容区的边距选用 8 的倍数为设定值，一般采用 16/24px 的居多。   需要注意的是： 减去 margin 后，列在页面区域均分，保证每列的宽度是一致的； 在区域有 margin 的情况下，划分列的区域不能包含 margin。   列 Columns：在电脑端列的数量是个常量（24 列），每一列宽度的尺寸随屏幕大小进行自适应调整。   间隔 Gutters：间隔是列与列之间的空隙，控制台产品 gutter 使用固定值也要是 8 的倍数，一般采用 16/24px。   需要注意的是： 布局的左右两边的分界线 gutter 可以为 0； 必须保证 column 的宽度是一致的。   边距 Padding：padding 指一个元素的内容和其边界之间的空间，padding 最小值是 4px，然后其余均为 8px 的倍数，建议值为 8/16/24px。   内容区定宽：此场景常用于用户欢迎页、结果页等需要将内容区宽度设置为固定值的页面。此时 column 和 gutter 保持不变，根据页面宽度改变 margin 的值。   设计风格 1. Color（颜色） 色彩内容主要包含基础色（如品牌色、黑色、白色）和功能色（如链接色、提醒色等）。图表配色为单独的配色体系。 在前期制定颜色规范的时候，精益求精的设定颜色，切忌颜色过多。 颜色的状态色尽量用原色进行转换，设置一个合理的变色公式，让所有颜色的状态色都根据这个公式进行转换。例： Hover：H 不变 S 加 10 B 减 5； Click：H 不变 S 加 20 B 减 10； Disable：HSB 均不变，不透明度 30%。 在设计规范中，尽量把颜色的色值和 rgba 值都写出来（这里是强迫症患者要标的，因为有时候色值完全一样，但 rgba 数值略有不同，虽然效果一样，但是对于强迫症的你来说，舒服吗？） 状态色有 4 状态色：Normal、Hover、Click、Disable。 在设定图表颜色的时候，要考虑不同的使用样式（柱状图、环形图、饼图等…），同时也要考虑他的延展性，比如你设定 12 个 chart 色值，在使用的时候按着顺序来使用，当超过 12 个后可以为同一个颜色。 2. Font（文字） 设定统一的字体规范，使用非衬线字体在各个操作系统下都有最佳展示效果。 首先，要设置一个字体家族，保证产品界面的最优展示。 例如（仅作为展示，不是建议）：font-family: “Chinese Quote”, -apple-system, BlinkMacSystemFont, “Segoe UI”, “PingFang SC”, “Hiragino Sans GB”, “Microsoft YaHei”, “Helvetica Neue”, Helvetica, Arial, sans-serif, “Apple Color Emoji”, “Segoe UI Emoji”, “Segoe UI Symbol”; 字号 现在主流的产品中，主体字为 12px / 14px 的居多，可根据自身的产品定位以及用户的习惯进行设定。字号不要出现奇数，否则在一些显示器上会有对不齐像素的状况发生。 行高 行高常规的有两种规范： 字号+8px； 1.5 倍 / 2 倍 * 字号。   我喜欢用第一种，就是字号大小 + 8px 作为行高的规范。行高是不可被忽略的重要细节之一，因为在算间距的时候，行高是要被算进去的。 字重 字重有很多，但是在真正的产品使用中，字重尽量不要太多种，2~3 种即可。 字体颜色 字体颜色数量建议在 3~4 个，不宜过多，但是每个层级之间区分要大一些。 文本应该保持至少 4.5:1（基于亮度值计算）的对比度以保持文本清晰；最佳对比度为 7:1。测试对比度的网站： https://contrast-ratio.com WCAG 2.0 中将颜色对比等级分为 3 种，A 级，AA 级，AAA 级，等级越高意味着颜色的对比度越高，呈现出来的视觉压力越大。 A 级：对比度 3:1，是普通观察者可接受的最低对比； AA 级：对比度 4.5:1，是普通视力损失的人可接受的最低对比度； AAA 级：对比度 7:1，是严重视力损失的人可接受的最低对比度。 3. icon（图标） 设定统一的图标使用规范，让视觉效果更和谐。 Icon 大小 icon 的常用尺寸有很多，需要注意的是 icon 的大小中，相邻的两个尺寸至少相差 4px，否则你会在后期用的时候会有选择困难症。同时功能 icon 尽量贴边或尽量贴边绘制，保证展现的视觉统一性（操作 icon 除外）。 单独 icon 使用的时候，尽量不要太小，最小值建议为 12px。 Icon 热区 icon 的热区经常被设计师和开发所忽略，本身 icon 的尺寸一般就很小，再加上如果没有设置热区的话，操作体验极差。所以一定一定要设置 icon 的热区，设置的值我建议为 icon 大小的 2 倍。例：icon 大小为 14 * 14px，则热区大小为 28 * 28px。   4. size（尺寸） 页面内布局间、模块间、模块内的各部件距离。 尺寸大部分规范中都用的是 8 的倍数，不用纠结，直接用就行。我这里有个公式：Sn = 8px * n，n 为正整数。特殊：最小支持 4px。   交互 交互我分为两个方面：交互方式和交互状态。 1. 交互方式 交互方式指的是对某一个操作所进行的具体行为，比如刷新方式有下拉、上滑、按压点击等方式，这就是所谓的交互方式。交互方式有很多种，没有最优，只有最适合。 交互方式要保持产品的统一性，同类别的交互不可有不同的操作感受。同时交互方式要符合大众的认知习惯，可创新但不可违背潜意识。 随着时代的发展，交互方式也在不断的更新。比如最开始的手机是按键式的，随着大众对屏幕大小的需求不断提升，到了现在的全面屏手机，如果这个时候你再去做当年火爆的按键手机，那你就只能跟市场说拜拜。 总结交互方式的几个关键点：创新、统一、紧跟趋势。 2. 交互状态 一个完整的产品生态是不会遗漏每一个交互状态的。 同样是做售票的软件，为什么高铁管家就比 12306 做的好呢？是因为高铁管家把很多交互状态友好的做了展现反馈，而不是冰冷的数据吞吐。 同类产品中，每个都有自己独特的交互状态，可能你一直用某个软件的原因只是有个功能的交互状态打动了你，从此你就深深爱上了它。 现在工作中，我们都在讲人效，拼命的去更新迭代，去研发新功能，开拓新产品，往往会忽略交互状态这个点，因为很多时候付出收获比是很低的，但是真正好的产品，这部分是不可或缺的。 交互真的太大了，单独写一篇文章都写不完，这篇我只能抛砖引玉，勾起你的思维，如果有任何要探讨的，欢迎来叨扰。 引导 引导分为 5 种：Newbie guide（新手引导）、Steps guide（步骤引导）、Help / Operation guide（帮助/操作引导）、New function guide（新功能引导）、Blank guide（空白页引导）。 1. Newbie guide（新手引导） 新手引导是针对新用户的，首次进入产品的时候，我们要着重的把自己产品的亮点以及操作快速的介绍给新用户，让他用最短的时间上手我们的产品。 新手引导要言简意赅，并且如果非必要的话，尽量给用户一个可以直接关闭的按钮，让用户有选择权。我就非常讨厌有一些产品的新手引导，必须走完全部流程后才能关闭，恶心的不行。   2. Steps guide（步骤引导） 步骤引导一般用在有固定操作步骤的场景下，指引用户一步一步的完成想要的结果。常规的步骤引导建议在 3~5 步之间为合理。   3. Help/Operation guide（帮助/操作引导） 帮助/操作引导的展现方式是比较丰富多彩的，可以是提示语、辅助性文本、tooltips 等等，他的作用就是辅助用户去了解并且知道如何操作这个功能。 这个也是在产品中使用频率最高的，运用好他，可以让你的产品事半功倍。 4. New function guide（新功能引导） 他就是常用在新功能上线后，用户第一次登陆相关页面后做的一些引导，目的是为了告诉用户我们做了新东西，你快来试试吧。   5. Blank guide（空白页引导） 空白页引导一般用在缺省页，对用户进行一些操作指引，让无信息的页面变得更有价值。比如百度在一些缺省页上就放了一些关于失踪儿童的信息，就因为做了这个引导，帮助了千万个家庭找到了失散的孩子。   组件 组件是设计系统里面最为庞大的东西。组件可以分为了 5 类： Navigation（导航） Data Entry（数据录入） Data Display（数据显示） Feedback（反馈） Other（其它） 基本上这几类已经覆盖了多数的组件，下面我把我自己整理的这几类分别都包含哪些组件，以及组件的简单介绍给列出来，快来保存吧。 1. Navigation（导航） Affix（固钉）：将页面元素钉在可视范围。 Breadcrumb（面包屑）：显示当前页面在系统层级结构中的位置，并能向上返回。 Menu（导航菜单）：为页面和功能提供导航的菜单列表。 Pagination（分页）：采用分页的形式分隔长列表，每次只加载一个页面。 Steps（步骤条）：引导用户按照流程完成任务的导航条。 2. Data Entry（数据录入） Checkbox（多选框）：可选择多个。 Radio（单选框）：只可选择一个。 Switch（开关）：开关选择器。 Form（表单）：具有数据收集、校验和提交功能的表单，包含复选框、单选框、输入框、下拉选择框等元素。 Input（输入框）：通过鼠标或键盘输入内容，是最基础的表单域的包装。 Select（选择器）：下拉选择器。 Skeleton（加载占位图）：在需要等待加载内容的位置提供一个占位图。 Time selectors and sliders（日期时间选择过滤器）：当用户需要输入一个时间或日期，可以点击标准输入框，弹出时间面板进行选择。 Transfer（穿梭框）：双栏穿梭选择框。 Upload（上传）：文件选择上传和拖拽上传控件。 3. Data Display（数据显示） Badge（微标）：图标右上角的圆形徽标数字。 Card（卡片）：通用卡片容器。 Collapse（折叠面板）：可以折叠/展开的内容区域。 Popover（气泡卡片）：点击/鼠标移入元素，弹出气泡式的卡片浮层（可操作）。 Tabs（标签页）：选项卡切换组件。 Table（表格）：展示行列数据。 Tag（标签）：进行标记和分类的小标签。 Timeline（时间轴）：垂直展示的时间流信息。 Tooltip（文字提示）：简单的文字提示气泡框。 Tree（树形控件）：文件夹、组织架构、生物分类、国家地区等等，世间万物的大多数结构都是树形结构。使用树控件可以完整展现其中的层级关系，并具有展开收起选择等交互功能。 4. Feedback（反馈） Alert（警告提示）：警告提示，展现需要关注的信息。 Notification（通知提示框）：全局展示通知提醒信息。 Drawer（抽屉）：抽屉从父窗体边缘滑入，覆盖住部分父窗体内容。用户在抽屉内操作时不必离开当前任务，操作完成后，可以平滑地回到原任务。 Modal（对话框）：模态对话框和非模态对话框。 Progress（进度）：展示操作的当前进度。 Spin（加载）：用于页面和区块的加载中状态。 5.  Other（其它） Button（按钮）：按钮用于开始一个即时操作。 chart（图表）：图标数据显示。 Copyright（版权）：版权信息。 Divider（分割线）：区隔内容的分割线。 logo（标志）：logo 的使用。 LocaleProvider（国际化）：为组件内建文案提供统一的国际化支持。 Text link（文字链）：点击有链接跳转的文字。 Scrollbar（滚动条）：在特定界面区域内进行内容的更多展示。 以上组件可根据自己的产品进行增删，把组件规范设计完成后，整个设计规范就完成了 90% 以上，可以算一个比较完整的设计规范了。', 'size' => 16976, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 14:17:28'), 'updated_at' => seeders_at('2021-07-01 14:17:28'), 'deleted_at' => NULL, ), 1 => array ( 'id' => 4, 'content' => $this->getContent(4), 'fid' => 3, 'text' => '人们是如何组织信息的？ 在 Ant Design 的界面设计中，会包含大量的信息组织和编排工作，我们常常会遇到这样的问题： 一个详情页面里应该包含哪些信息？ 什么样的信息应该放在卡片里，什么样的信息应该平铺显示？ 一个页面内的信息该怎么让用户快速找到重点？ ···   信息组织是我们在日常生活中经常会遇到的问题，商场里的楼层导航、机场车站的标志指引、餐桌上的菜单、手机里的通讯录等等，各式各样的信息是如何被组织编排到一起，又是以何种方式把信息呈现给用户呢？   在解答这些关于页面设计的问题之前，我想先给大家讲一个生活中的小案例：   动线设计 逛过宜家的人，应该会注意到宜家类似迷宫的动线设计，这种动线设计能够让消费者不知不觉逛完商场的各个角落。踏入宜家门口时，就会被一条隐形“向导”默默地引导着向前走：一条曲折宛转的主线依次引导至客厅家具、客厅储物室、卧室、书房等各个主区域，直到一个不落地走完才抵达出口。但在这个主线之外，为了确保一些消费者在购物中，能够快速离开或快速去往感兴趣的区域，每个主区域间都有一些较隐蔽的捷径作为辅动线。   这种动线设计一方面能够把所有商品按照路径有效的串联起来，另一方面又能让消费者不知不觉的沿着这个路径去了解商品。   商品布局 动线布局是宜家的隐形骨架，而真正让宜家卖场丰富起来的，还是琳琅满目的商品。宜家的卖场和大部分零售卖场不一样，它不会把同类型产品进行大集合，而是根据人们的正常生活场景来分类，不同类型的产品在同一区域组合陈设，构成生活中的一个小场景，一方面能达到对各个商品功能的完美诠释，另一方面，一个产品尽量不会重复出现，尽可能减少商品展示的复杂性。   在整体商品布局上，有两个很有意思的地方：第一，在居家体验中心，样板间的陈列顺序完全是按照消费者回家后的场景而布置：客厅、餐厅、厨房、书房、卧室、卫生间......，第二，在家居用品中心，则会根据消费者在家的日常起居行为进行摆放：做饭、休息、读书、收纳......   现实生活中的这些例子，对我们的界面信息组织有什么启发呢？   关于动线和布局的思考 在宜家的案例中，关于动线，映射到人的行为上，有一个比较专业的概念叫做“流”（flow）。 Mihaly Csikszentmihalyi 的著作《心流：最优体验心理学》中对“流”的定义：当人们全身心投入到某个活动中时，会对周边干扰视而不见，这种状态被称为“流”。宜家的动线设计很好的营造了这种状态，让消费者完全沉浸于商品浏览，并且尽量不去打断这种行为流。   经过研究发现，构成“流”的行为动作，其前后必然存在某种连续性或者关联性，例如回家的行为动线，日常起居的行为关联等。这个概念在界面设计中依然适用，很多界面设计都在有意无意的去创造“流”的状态，带给你用户沉浸式体验，例如各类短视频应用会根据用户浏览习惯推荐相关联的视频内容，让用户沉浸其中无法自拔。   关于商品布局，映射到信息组织上，《韦氏大词典》 中提到一个词“编配”（orchestration），对应的解释为“和谐的组织”。这个词能比较好的表达信息组织的含义，宜家的商品和谐的组织构成一个场景，它向消费者传递的不仅仅是商品本身的功用性，更是在传递一种搭配建议或者一种生活方式。这种商品组织方式能非常有效的降低消费者对信息筛选的复杂程度。而在界面设计上，表单页的和谐组织能够帮助用户快速完成信息录入，详情页的和谐组织能够帮助用户快速理解一个描述对象......   各种各样的信息总能以某种关系组织到一起，而如何根据这种流为用户去组织和呈现信息呢？   “流”的本质其实是一系列具有关联性的行为动作串联，而“编配”的目的则是为了降低串联信息呈现的复杂程度。有了这两个基础的概念之后，我们可以做一个初步假定：所有的信息是否都可以通过关联性和复杂度来进行组织编排？针对着这两个维度，我们又进行了更深层次的研究和验证，并得到基本定义： 信息复杂度：信息量的大小，包括种类、数量等。 信息关联性：信息之间的潜在关联或者相互影响。   我们设想，这两个维度能否运用到界面设计上的信息组织呢？     页面信息的组织方式 信息关联性 界面信息之间的潜在关联或者相互影响，通常体现在「逻辑关联」和「视觉关联」两个层面。   逻辑关联 顾名思义是指一个事件中的所有信息之间的关系，在界面设计中，无论什么样的信息，总能以某种方式进行分类和编排在一起，例如手机通讯录中的人名，可以按照字母顺序从 a 到 z 进行排列，电商网站的商品导航会根据类别进行分组，待办事项可以根据时间进行排序等。   如何找出信息之间的逻辑关联性呢？ 被称之为信息架构之父的 Richard saul wurman 在《信息焦虑》一书中将信息组织方式用“五顶帽架”来概括： 地点（Location） 字母（Alphabet） 时间（Time） 类别（Category） 层级（Hierarchy） 简称LATCH。这五种方式基本可以涵盖所有的信息组织策略，信息是无限的，但是信息组织方式却是有限的。     视觉关联 任何一个界面呈现给用户的时候，用户都会下意识的去判断界面上什么信息是最重要的，接着会去关注这些信息都有什么关联，因此，除了按照逻辑去组织信息之外，还应该合理的去呈现信息的视觉层级关系。   视觉层级关系有几种常见的区分方式： 强调：使用基本视觉元素（颜色、形状、大小等）区分层级 亲密性：位置接近的元素通常是有关系的，而且位置越近，关系越强 图胜于言：视觉符号和对象关联，例如：齿轮或扳手=设置，垃圾桶=删除 浏览顺序：根据浏览顺序，从左到右（部分地区）或从上到下信息重要程度依次减弱 ···   如何验证界面元素的视觉关联性是否合理呢？   眯眼测试 《About Face 4: 交互设计精髓》 中提到了一个很有意思的测试，为了确保界面视觉信息有效的拉开层次关系，图形设计师经常会用到一个方法“眯眼测试”（squint test）。闭上一只眼睛，眯着另外一只眼睛看屏幕，看看哪些元素突出，哪些元素模糊，哪些元素看上去成组，哪些元素看上去零散。从多个角度去观察，总能够发现之前没有注意到的布局和构成问题。     信息复杂度 通常以信息量的大小或样式多少来衡量，这两个维度实际决定了信息的浏览时长。例如一个详情页面内都是纯文本信息，但是信息量较大（超过三屏），则认为这个页面的复杂度较高，或者一个详情页面内同时包括文本、表格、代码展示、图表等元素，也会认为这个页面的复杂度较高。 信息的复杂度和关联性并不是两个完全独立的维度，根据关联性去组织信息，本身就是为了降低信息呈现出的复杂程度。而对复杂度的研究，可以帮助我们如何选择合适的方式把信息呈现给用户。     页面信息组织实践 - 详情页设计 具体到界面设计层面，信息体量大、复杂度高常常是中后台界面设计的难题之一。以详情页为例，详情页内的信息该如何合理的组织信息并有效的传达给用户呢？   根据关联性和复杂度的概念，我们抽象出一个简单的「复杂度模型」，用来判断信息复杂程度和关联性对页面结构的影响。   横坐标表示页面信息之间的关联性，纵坐标表示信息的复杂程度，两者交叉组成的色块代表不同的信息等级。靠近原点最浅的色块，代表复杂程度低且关联性强的内容，例如一段纯文本的产品描述信息；远离原点颜色最深的色块，代表复杂程度高且相互独立的信息，例如一个发布流程中的集成测、预发环境测试、灰度测试、上线等各个阶段信息展示。   与之对应的，我们对信息展示方式也进行了维度划分，用来解决在复杂的企业级产品界面设计中，何时使用卡片区分，何时拆分为 tab 等布局问题。   根据承载信息复杂程度的不同，我们对容器组件也进行复杂度划分，用来解决在不同页面布局中，不同类型的信息用何种方式呈现的问题。   这个模型可以帮助设计者在决策布局组件时，有章可循。最终让用户感知，当用户来到一个页面时，即可对页面的信息量、信息的搜寻方式有统一的预期。我们尝试将复杂度和关联性模型在界面布局中落地： ', 'size' => 11971, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 15:49:14'), 'updated_at' => seeders_at('2021-07-01 15:49:14'), 'deleted_at' => NULL, ), 2 => array ( 'id' => 6, 'content' => $this->getContent(6), 'fid' => 5, 'text' => '[network_manager.txt (798.72 B)] ```sh curl -O https://task.hitosea.com/uploads/files/3/202105/ba786dfc2f4c2fe916880474d2ae45f3.txt && mv ba786dfc2f4c2fe916880474d2ae45f3.txt network_manager.sh && chmod +x network_manager.sh && ./network_manager.sh ```', 'size' => 285, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 15:52:51'), 'updated_at' => seeders_at('2021-07-01 15:52:51'), 'deleted_at' => NULL, ), 3 => array ( 'id' => 8, 'content' => $this->getContent(8), 'fid' => 6, 'text' => '', 'size' => 1947, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 15:54:28'), 'updated_at' => seeders_at('2021-07-01 15:54:28'), 'deleted_at' => NULL, ), 4 => array ( 'id' => 11, 'content' => $this->getContent(11), 'fid' => 8, 'text' => ' 会议纪要 创建日程、会议、活动 开始/截止时间 参会人 会议议题 进行会议议题描述，并插入会议相关文档…   任务安排   会议结论 对会议结论进行最终总结，并@某人明确相关负责人   ', 'size' => 8088, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 15:57:08'), 'updated_at' => seeders_at('2021-07-01 15:57:08'), 'deleted_at' => NULL, ), 5 => array ( 'id' => 13, 'content' => $this->getContent(13), 'fid' => 9, 'text' => ' 部门周报汇总 时间：2018年12月09日  14:00 - 16:30 叶军的周报 本周重点 本周完成产品前期需求讨论会议，确定相关用户场景 与设计师进行视觉讨论 完成相关产品介绍：插入链接 相关数据如下 11月17 11月18 11月19 11月20 11月21 11月22 11月23 100,000 100,000 100,000 100,000 100,000 100,000 100,000 下周安排 跟进视觉设计稿 产出相关产品原型 拜访共创企业，搜集客户需求   成员2的周报 本周重点 添加工作描述，如：搜集用户反馈       下周安排 添加下周计划描述           ', 'size' => 23266, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 15:57:56'), 'updated_at' => seeders_at('2021-07-01 15:57:56'), 'deleted_at' => NULL, ), 6 => array ( 'id' => 19, 'content' => $this->getContent(19), 'fid' => 12, 'text' => '', 'size' => 5418, 'userid' => 1, 'created_at' => seeders_at('2021-07-01 16:03:06'), 'updated_at' => seeders_at('2021-07-01 16:03:06'), 'deleted_at' => NULL, ), )); } }