选择分类
  • 云瑞原创
  • Mockups
  • Ui Kits
  • 背景纹理
  • 图标
  • 平面图形
  • 探索
  • 笔刷
  • 图层样式
  • PPT模版
  • 影视素材
  • 教程
  • C4D资源
  • PS动作
  • 常用3D资源
  • 字体
  • 网站模板
  • LR预设
  • 设计学院

如何使用 Strings Method 来改进 UI 设计

有时,当您构建 UI 或尝试分析竞争对手的应用程序时,您会注意到 UI 出现问题,但无法确定问题所在。它只是看起来不对,或者没有很好地对齐,或者很吵。

如果你需要让UI看起来更专业、更干净,可以使用Strings Method来快速清理。

让我们先看一下这个屏幕,它明显有噪音并且对齐得不好

1MWJwc_g2BRGOZgYG_xPXGw

UI设计中如何使用Strings方法

  1. 第一步,我们需要水平扫描屏幕的每一行,并在每次看到路径上的任何新对象时绘制垂直线(字符串) ,如下所示:

1PcTQN9ZltCcOCJxO3KRn9Q
大量的字符串表明 UI 很嘈杂并且对齐得不好

2. 其次,您需要重新构建UI并减少垂直线的数量。无需更改版式、颜色和改进布局,只需减少字符串数量即可 显着改进 UI

17zMKRyU3Gtuv7LMFki9xlg
左边:字符串数量减少,右边:包含内容和颜色的版本以查看结果

3. 现在我们可以将原始设计与更新后的设计进行比较:

13nlavxxks1v6GGsHz-gMMA 1cnyCEUL9dZlZxPp-LzIZww

使用字符串方法可以成为改进 UI 设计的宝贵工具,但重要的是要认识到列在此过程中也发挥着作用。虽然字符串方法有助于快速清理 UI,但列可以为您的设计提供结构和组织。将列视为基础,确保元素整齐排列和对齐,而字符串方法就像用于详细分析的微调工具。

翻译:云瑞设计
原文: medium

 

云瑞设计小程序
云瑞设计小程序

微信扫一扫
手机使用更方便!

云瑞设计订阅号
云瑞设计订阅号

关注我们的微信订阅号,不错过任何福利。