早读课优秀产品设计的十条准则

早读课优秀产品设计的十条准则

作者:灵灵柒捌玖拾 发布:2026-02-27 10:16 0浏览

回答 共1个

写在前面的废话近年来ui设计的流行趋势可谓你方唱罢我登场,好不热闹,但如果一种ui设计模式仅仅是好看,那么它一定不会长久,永不过时的模式唯一的重要条件之一就是用户友好性,并且无论设计趋势如何变化,它都能适应,例如基于网格系统的设计布局,这些经典的ui设计模式是一切ui设计潮流的基础。卡片式布局卡片式设计最早流行于等网站,这种设计一般比较适用于新闻网站或者博客类网站,因为可以放置大量的内容,同时又能保持每一个卡片上的内容都清晰可见。顾名思义,所谓卡片式就是各种大小的类似纸片的卡片样式,一般主要有两种设计模式,一种是所有尺寸相同的卡片均匀的铺在页面上,如的首页布局,另一种则是瀑布流的卡片布局,就是把大小不同的卡片排列成有序的列,却没有不同的行,例如,或者国内的花瓣网。卡片式的布局因为将内容分开,易于用户分辨查看内容,因此往往效果很好,而且对于设计新手来说,也很容易上手。当然还有卡片式设计除了这两种主流的用法,还有一些特别的方式,比如,采用了近视差滚动导航全屏幕卡。分屏布局分屏式的布局最早开始于2013年,在2016年开始流行。当两块元素在页面中具有相等的权重时,分屏式布局是给不错的选择,不过一般都是并排而不是垂直排布,用于图文搭配并需要突出文字时,通常会把文字覆盖在图片上一部分,这样可以带来简约精致的质感,当然在分屏布局下,文字与图片的结合也有很多种方式,暂不一一列举。大字体大字体的应用可以追溯到很久以前,但是随着移动端ui的兴起,大字体的广泛应用才开始普及。大字体作为标题是特别突出的(废话),并且,它还能带来极佳的视觉冲击体验,它能在页面中没有多少其他元素的情况下,独自撑起场面,相当壮观。啊放错图了个性化这是一个老调重弹的话题,人工智能可以根据每个人的喜好为用户提供不同的数字体验,例如奈飞(包括其他阅读订阅类网站)可以预测用户想看的电影并自动推荐到用户的列表。但是个性化也有负面效应,那就是即使用户没有搜索或以其他方式操作时,有时人工智能也可以预测人们可能感兴趣的东西。这种预测水平有时会使人感到被监视。因此,UI设计人员应谨慎使用个性化设置。(这个作为ui设计人员要怎么注意?也许是弱化推荐内容,在用户需要被推荐时,恰当的显示在正确的地方,我猜的噢)网格系统凡是学ui设计的,没有没了解过网格系统的,这种排版方式甚至可以追溯到还没有网络,只有印刷出版物的时代。网格系统为视觉提供了平衡感和顺序,使内容更易于阅读,同时网格使布局设计具有了更大的灵活性,大多数的网格系统都是12列或者16列,有些网站的布局有明显的网格特征,而有的网站看起来似乎并没有网格,但实际上在做设计的时候,这些都是在网格系统的范围内完成的,因此这样的布局一般更美观,更合理。杂志风格的布局出版物的排版有时也会影响到互联网产品的设计布局方式,选择在各种网站上都可以看到类似的布局,例如电商网站和博客。杂志的版面布局一般会有一条特色文章作为突出,以及后面的第二和第三条,有时内容也会分成多列或者几个部分,这些方式非常适合web端的ui布局设计,尤其是每天需要更新内容的网站。单页布局单页布局是指把所有内容放在单个页面上,导航是通过滚动完成的,通常使用快捷跳转控件跳转到指定的部分,对于内容不多的网站,单页布局是个不错的选择,也可以用来设计故事叙述类的页面(如互动式儿童读物)。F型和Z型F模式和Z模式是指你哟元素的排版位置来引导用户视线阅读顺序的一种设计方式,F型布局主要在于突出顶部内容,左下方为页面辅助内容,大致看约等于F字样。Z型布局在于内容的对等性,即从上至下所有的元素模块是一样的权重,从上至下沿Z字形排列。F模式在总体视觉上更具有层次感,适用于内容较多的页面,而当页面内容元素权重对等的情况下,则Z模式更合适。不对称布局顾名思义,不对称的含义就是不对称(废话),不对称的设计会产生更具有动态的视觉冲击效果。不对称的布局方式一般是用极不平衡的图像和字体来设计完成的,还可以加入别的,如不对称的背景来加强这一效果。不对称的设计会产生动态的充满活力的视觉印象,因此对于想要达到此类形象的产品来说,是再合适不过了。简洁的布局严格来说,这个说法并不是排版的一种方式,而是一种理念,简洁的布局流传已久,他们的优点也显而易见,那就是将关注点更多的聚焦在内容上,不给用户造成视觉上的影响。干净简单的布局适合任何设计页面,无论是网格布局,不对称,还是分屏布局,都可以贯彻这一理念,许多高端大气上档次,低调奢华有内涵的网站,都是这样来的。写在后面的废话不会过时的ui设计模式从来都是具有适应性和用户友好性的属性,无论是过去还是未来,只需在这些经典设计模式上注入当下设计潮流即可完成一个好的设计。公众号不知设计院每天分享一篇国外优质设计翻译文章及灵感视频,欢迎关注。完全免费素材下载网站

0赞同

2026-02-27 10:16:37