element ui 空格_空格是您的UI朋友。 大量使用它。

element ui 空格

Originally published at marcandrew.me on July 30th, 2020.

最初于 2020 年7月30日 marcandrew.me 发布

Ah good old White Space. One of the simplest things to add to your designs to improve both your UIs, and user experience. Let me share my (quick) thoughts with you on why you need to use it generously, and show it some love.

很好的旧空格。 添加到您的设计中以改善UI和用户体验的最简单的事情之一。 让我与您分享一下我的(快速)想法,您为什么需要慷慨使用它,并表达一些爱意。

允许您的网站或应用程序室的消息呼吸。 (Allow the message of your site or app room to breathe.)

It makes me weep into my pillow (with rounded corners of course) when I see UIs bursting at the seams with masses of information crammed into such a small area.

当我看到用户界面在接缝处爆裂 ,大量信息塞满这么小的区域时,它使我哭泣(当然是带有圆角的)。

The message of your Website or Mobile App has no room to breathe, and this in turn has your user gasping for air as they try to digest the information that’s in front of them.

您的网站或移动应用程序的消息没有呼吸的余地 ,这又使您的用户在尝试消化面前的信息时喘不过气来。

A neon sign with the word ‘Breathe’ in pink lettering
https://unsplash.com/@fabimoehttps://unsplash.com/@fabimoe

Of course there’s times when an abundance of the white stuff is just not practical.

当然,有时候很多白色的东西是不切实际的。

Amazon for example couldn’t apply a ridiculous amount of White Space to their UI. They’ve got a lot of products, and a small shop window to display it all in. Too much White Space is money right?

例如, 亚马逊无法将大量的空白应用到他们的用户界面。 他们有很多产品,还有一个小商店橱窗可以全部显示出来。 太多的空白是金钱吗?

A small robot made from Amazon cardboard boxes
https://unsplash.com/@helloimnikhttps://unsplash.com/@helloimnik

But for many other types of sites, the generous use of something as simple as White Space can bring your message across much easier, present a more professional looking and polished UI, and make for a much better experience for the user.

但是对于许多其他类型的网站,像White Space这样简单的内容的大量使用可以使您的消息更容易传播,呈现更专业,更优美的UI,并为用户带来更好的体验。

Like I mentioned, it’s one of the easiest things to implement inside of your designs, and can take any UI from average to ‘Hot Damn!’ with minimal effort.

就像我提到的那样,这是在设计内部实现最简单的事情之一,并且可以将任何UI从平均水平变为“ Hot Damn!”。 用最少的精力。

Use it generously. Use it well. Your UIs (and end-users) will thank you for it.

大量使用它。 好好用 您的用户界面(和最终用户)将感谢您。

Thanks for reading the article.

感谢您阅读本文。

Want more UI & UX Tips? Awesome! Grab my FREE Cheatsheet at https://marcandrew.me/the-ui-ux-cheatsheet

需要更多UI和UX提示吗? 太棒了! https://marcandrew.me/the-ui-ux-cheatsheet上获取 我的免费备忘单

Image for post
UX Para Minas Pretas (UX For Black Women), a Brazilian organization focused on promoting equity of Black women in the tech industry through initiatives of action, empowerment, and knowledge sharing. Silence against systemic racism is not an option. Build the design community you believe in.UX Para Minas Pretas (UX For Black Women),这是一个巴西组织,致力于通过采取行动,赋权和知识共享的举措来促进科技行业中的黑人女性平等。 对系统性种族主义保持沉默是不可行的。 建立您相信的设计社区。

翻译自: https://uxdesign.cc/white-space-is-your-ui-friend-use-it-generously-dab7f4984a1b

element ui 空格

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/274324.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

solaris 11 vim的安装【转】

转自:http://www.itkee.com/os/detail-4a4.html 下面是安装方法,拿出来分享一下 ①下载软件的地方: ftp://ftp.sunfreeware.com/pub/freeware/intel/10/ http://artfiles.org/sunfreeware.com/pub/freeware/i386/10/ vim-7.2-sol10-x86-local…

看看老外是如何理解抽象类的

下面是我翻译的关于帮助理解抽象类的例子。 这是一个例子帮助我们理解抽象类。在我看来这是一个非常简单的方法。让我们一起来看看下面的代码&#xff1a; <?php class Fruit { private $color; public function eat() { //chew } publi…

qt 设计师缩放_重新设计缩放体验

qt 设计师缩放With the COVID-19 pandemic hitting countries across the world, a lot of people have now switched to video meetings. Be it for your official meetings, webinars, entertainment sessions — video meetings are the new normal. We saw these video mee…

安卓应用部件_设计应用程序小部件的痛苦和喜悦

安卓应用部件Some people say widgets are a thing of the past, but recently we faced a market for which this was one of the main features users were asking for. A bit of googling showed there are not a lot of useful articles covering widget design (most info…

ASP.NET MVC3中的ViewBag动态性

在MVC 3中的有一个新的ViewBag 动态特性&#xff0c;它主要是为了从Controller到view进行传值用的&#xff0c;类似有所使用的ViewData[] 字典类。对于ViewBag是如此的强大&#xff0c;意味着你能动态的set/get 值&#xff0c;增加任何数量的的额外字段而不需要强类型的检测。…

ux设计中的各种地图_UX设计中的空白

ux设计中的各种地图UX设计中的空白是什么&#xff1f; (What is white space in UX design?) This article will help you learn about white space and why it so important in UX design.本文将帮助您了解空白以及为什么空白在UX设计中如此重要。 White space is a very us…

花点时间了解消息,句柄和窗口

消息、句柄和窗口 一&#xff0c;为什么我要花时间研究这些东西 对于我个人来说我不想做码农&#xff0c;不想只知道拖控件&#xff0c;使用控件有的时候要了解一下底层&#xff0c;不知道你们有没有想过这样的一个问题&#xff0c;我们在C#中使用的的event事件是怎么触发这个事…

ux设计中的各种地图_如何在UX设计中使用颜色

ux设计中的各种地图Color is the mother tongue of the subconscious.颜色是潜意识的母语。 — Carl Jung—荣格 Color has more to say than meets the eye. As a building block of visual language, color highlights, guides attention, and unifies elements. In UX, co…

《Two Dozen Short Lessons in Haskell》学习(十八) - 交互式键盘输入和屏幕输出

《Two Dozen Short Lessons in Haskell》&#xff08;Copyright © 1995, 1996, 1997 by Rex Page&#xff0c;有人翻译为Haskell二十四学时教程&#xff0c;该书如果不用于赢利&#xff0c;可以任意发布&#xff0c;但需要保留他们的copyright&#xff09;这本书是学习 Ha…

figma设计_Figma中简单,可重复使用的设计系统

figma设计Putting together a design system may seem like an unnecessary hassle. It’s often easier to jump straight into designing things without having to worry about styles, components, or libraries. Some might even argue that when it comes to smaller pro…

WPF 关于鼠标事件和坐标

Mouse.GetPosition(window);可以在任何时间获得相对任意元素的鼠标位置 Mouse.Capture(el);可以让某个元素获得所有的鼠标事件不管他应不应该的到鼠标事件 Mouse.Capture(null);解除转载于:https://www.cnblogs.com/wangjixianyun/archive/2013/03/25/2980953.html

访问25%无法访问的人-如何设计可访问性

We’re increasingly dependent on the internet and computers for everything we do — this has become starkly more obvious through the COVID19 global pandemic.我们所做的一切都越来越依赖于互联网和计算机-通过COVID19全球大流行&#xff0c;这一点变得更加明显。 F…

DDD:实体如何处理外部依赖

场景 修改用户名时&#xff0c;要验证用户名的唯一性。 实现1 1 public class User 2 { 3   public void ChangeUsername(string newUsername) 4   { 5   //使用服务定位器获取IUsernameUniqueService &#xff0c;执行验证。 6   } 7 } 实现…

架构师论坛 创业_我在早期创业时作为设计师学到的东西

架构师论坛 创业For over 2 years at a young product company, I collaborated with talented engineering folks for a 0 → 1 suite of products. Here are my learnings and key takeaways. Of course, these are my views and do not represent those of my employers or …

HFileOutputFormat与TotalOrderPartitioner

最近需要为一些数据增加随机读的功能&#xff0c;于是采用生成HFile再bulk load进HBase的方式。 运行的时候map很快完成&#xff0c;reduce在sort阶段花费时间很长&#xff0c;reducer用的是KeyValueSortReducer而且只有一个&#xff0c;这就形成了单reducer全排序的瓶颈。于是…

qt按钮禁用和激活禁用_为什么试探法只是经验法则:禁用按钮的情况

qt按钮禁用和激活禁用Most user experience designers will be familiar with Jackob Nielsen’s 10 usability heuristics. They are widely cited and a great set of broad rules of thumb to follow when designing user interfaces.大多数用户体验设计师将熟悉Jackob Niel…

Teach Yourself Java 2 in 21 Days 书中样例代码实践

找了好几书JAVA的书&#xff0c;看了几章&#xff0c;都看不下去。 我觉得适合《Teach Yourself Java 2 in 21 Days》&#xff08;Rogers Cadenhead Laura Lemay&#xff09;还是适合我的。 孙卫琴那本&#xff0c;我感觉就罗嗦多了没到我点子上。 接口&#xff0c;抽象类这些内…

好奇心机制_好奇心问题

好奇心机制For my past two jobs I’ve posted a question every week in my team chat and learned so much about my co-workers. Give it a try! :D对于过去的两个工作&#xff0c;我每周都会在团队聊天中发布一个问题&#xff0c;并且对我的同事了解很多。 试试看&#xff…

20130328java基础学习笔记-循环结构for以及for,while循环区别

1.循环结构:for讲解class ForDemo{ public static void main(String[] args) { /* for(初始化表达式;循环条件表达式;循环后的操作表达式) { 执行语句;(循环体) } */ for(int x 1; x<3; x) { …

小程序设计避免犯什么错_新设计师犯下的5种印刷错误以及如何避免

小程序设计避免犯什么错Over the last year and a half, I’ve had the opportunity to teach the basics of typography to undergraduate graphic design students. During this time, I’ve noticed some common mistakes that my students make when first learning how to…