（内含注释，底部附参考译文）How to not suck at design, a 5 minute guide for the non-designer.Good design principles can be learned and exercised by anyone. This guide will give you a basic knowledge of practical design tips you can apply today (and impress your design friends).If you don’t believe you can learn design, just remember what our legendary friend David Eric Grohl said about learning new things:I never took lessons to play the drums. I never took lessons to play the guitar. I just sort of figured it out. I think that if you’re passionate about something and you’re driven and you’re focused, you can do anything you want to do in life.— Dave Grohl, Foo FightersWith Mr. Grohls words in mind, are you ready for your crash course? Buckle up buttercup, here we go in no particular order:①figure it out 指出，想通， 弄明确，搞定它②crash course 速成课③in no particular order 无特定顺序1. Use plenty of contrastThe background and font color should be different enough to not cause eyestrain. Typically black text on white backgrounds tends to be the most legible. Stay away from the light gray, yellows and greens. If you have to squint to read then you know you have a problem.④be adj（形容词） enough to do sth / not do sth ...是足够...来做某事/才不会做某事Eg:This guy is intelligent enough to be ascientist. 这个家伙足够智慧来当一个科学家了.From: https://developer.apple.com/design/tips/2. Almost Black is easier to read than BlackIf you have the choice, try using the color #333333 RGB (51,51,51) instead of pure black for your text. Pure black on white jiggles for the eye and makes the letters hard to focus on.⑤instead of 取代... 常译为：而不是 Tips: 做阅读时，but/instead of ...等后面的内容是否认内容，其前面的内容是肯定的。3. Important Content FirstLayout the most important information first to clearly support the primary use case of your app or website. Important content should be visible without zooming or scrolling or tapping.⑥Prep+V-ingFrom: https://developer.apple.com/design/tips/Lets view some examples of good visual hierarchy in the wild.Instagram (below, on the left) puts a clear focus on the photo/video posted by the user.⑦In puts a focus on the photo (which) posted by the user 定语从句限定photo划线部门为完整的句子，不缺任何身分。(which)为省略掉的关系代词 ⑧Posted by 被用户公布的Pinterest (below, on the right), creates visual hierarchy by pinning their search bar to the top followed by their nice grid below. Pinterest is very intentional about having their search box as the first item on the page.⑨about+V-ingSearch is the core function of the app, folks use Pinterest to discover and browse.Lets look at two more examplesSpotify (below, on the left) clearly is celebrating the album artwork and song title first and player controls second. Even though the player controls are secondary, Spotify gives more weight to the play and pause button over fast forward and reverse.Facebook (below, on the right), looking very similar to Instagram, chooses to put the content of your friend front and center.4. Align all the thingsThe fastest way to fix something that feels off or janky is to make sure the alignment is not off. When designers talk about the need to use a “grid” they are trying to alert the team to the issue of mis-alignment.Fixing alignment is one of the easiest improvements we can make to any app or website and instantly makes an app or website look 10x better.⑩动名词做主语⑪one of +[n]sFrom: https://developer.apple.com/design/tips/Lets look at another alignment example, this time from medium.comHere is a web layout I tweaked from Medium.com — how does this look to you?Does anything feel off about this layout?Hint: notice the alignment on the left edge. How does it look?On the left I highlighted the visual river caused by mis-alignment, on the right I simply left aligned all the major content blocks.Wonky alignment on the left creating a visual river, consistent alignment on the rightBad alignment on the left, Fixed alignment on the right5. Text size with spacingWe are not designing for ants.Increasing font size will make your content much easier to read and digest coupled with some liberal line spacing.Good text size vs bad text size from: https://developer.apple.com/design/tips/Good spacing vs. bad spacing size from: https://developer.apple.com/design/tips/6. Use a list view for results, if order is importantMost mobile and web apps have some type of search and there can be some healthy design debates on how to display the results.If order is important then a list view is most effective.If order doesn’t matter and you would like to encourage discovery (like Pinterest or AirBnB) then a grid view will encourage a gaze pattern to support discovery.How do Users View Search Results Presented in a Grid Layout? By C. Siu & B. Chaparro7. Design in black and white first, add color laterDesigning in black and white will keep the focus on solving and designing the core experience of your app.Color evokes strong emotional responses and often interrupts our ability to focus on the core design problem.8. Create comfortable designHand strain is a real issue, consider the graphic below from Luke Wroblewski’s amazing article: Responsive Navigation: Optimizing for Touch Across Devices.Luke lays out the areas of a phone that are easiest to reach and use (at least for right handers) — I’d love to see apps have a setting where you can switch the interface from right hand dominant to left hand dominant.⑫I’d love to see apps have a setting/[ where] you can switch the interface from right hand dominant to left hand dominant.定语从句Many effective mobile apps keep navigation and core actions in the bottom third of the phone.Image Credit: Luke Wroblewski Responsive Navigation: Optimizing for Touch Across Devices9. Borrow Color PalettesColor is a bit of an elusive dark art. I highly recommend heading over to Dribbble and searching for “Color Palettes” or use a color palette generator like Coolors or Color Claim.⑬highly recommend 强烈建议Save yourself the hours of endless debate and second guessing.10. Use Apple and Google OS ConventionsApple and Google have created incredible resources for anyone building software for Android or iOS.For example, the Google Material spec has guidelines, resources, colors, icons and components to help jump start the design of your app.Apple has the HIG — their Human Interface Guidelines, which outline everything you need to know on how to design an iOS app.Various screenshots from Google Material Design and The Apple Human Interface GuidelinesRemember, design takes practiceTraining your eye to look for the design issues takes a bit of time and practice, but you will find the above tips will go a long way to making anything you create better designed.If you found this article helpful please tap or click “♥︎” and recommend this and share this with a friend who needs design help :)转载自：https://medium.com/startup-grind/how-to-not-suck-at-design-a-5-minute-guide-for-the-non-designer-291efac43037作者：Marc Hemeon参考译文：给设计初学者的5分钟设计指南，告诉你如何不做烂设计好的设计原则可以让任何人学习和使用，本指南今天将为你提供一些在实用的设计技巧中的基本知识，这些内容或许也将会感动你的设计师朋侪。如果你不相信你可以学习设计，只要记着我们著名的朋侪大卫·格鲁（David Eric Grohl，美国涅槃乐队鼓手）所说的关于学习新事物的内容：我从来没有上过打鼓课，也从来没有学过吉他。
我只是似乎弄明确了。我认为，如果你对某些事情充满激情，你是主动而且专注的，那么你可以做任何你想做的事情。- Dave Grohl，Foo Fighters看了大卫·格鲁这句话，你准备好开始你的速成课了吗？扣好宁静带，我们出发了。（以下内容无特定顺序）1.使用大量的对比配景和字体颜色应该很是差别，才不会造成视觉疲劳。
通常，白色配景上的玄色文字往往是最清晰的。远离浅灰色，黄色和绿色。如果你不得不眯着眼看，那你便知道是有问题的。2.靠近玄色比玄色更容易阅读如果可以选择字体的颜色，请实验使用靠近玄色的颜色，如＃333333 RGB（51,51,51），而不是纯玄色的文字。
纯玄色的文字在白配景上对比太过强烈，会让眼睛感受到字母不够稳定，很难集中视觉。3.重要内容放在首位将最重要的信息放在首位，详细的展示你的应用法式或网站的主要的案例。而且，这些内容应该不用放大、转动或点击，就能够清楚的看到。让我们看一下在自然状况下视觉条理结构很好的例子。
Instagram（左下方）将清晰的焦点放在用户公布的照片/视频。Pinterest（右下方），通过将搜索栏牢固在顶部，下方紧接着网格，来建立视觉条理结构。Pinterest明确设计将他们的搜索框作为页面上的第一个内容。
搜索是应用法式的焦点功效，人们使用Pinterest探索和浏览。让我们再看两个例子Spotify（左下方）很显着，它将专辑封面和歌曲名优先展示，操控按钮放在第二。
纵然操控按钮是次要的，相比前进和倒退按钮，Spotify给播放暂停按钮更大的比重。Facebook（右下方），和Instagram很是相似，把挚友公布的状态放在中间的位置优先展示。4.把所有的工具对齐处置惩罚某些在感受上失去重点或十分微弱的问题时，最快方法是确保对齐方式没有堕落。
当设计师在谈论需要“网格”的时候，他们试图提醒团队注意没对齐的问题。保持对齐是我们可以对任何APP或网站举行最简朴的革新之一，并能让APP或者网站悦目10倍。
让我们看看另一个来自medium.com的对齐案例这是一个我调整过的Media.com的网页结构 - 看起来怎么样？对这个结构有什么感受吗？提示：注意左边缘的对齐。看起来怎么样？第一张图，我标出了由没对齐引起的视觉变化，第二张图，我对齐所有主要的内容。乱七八糟的内容在第一张图缔造出一个视觉曲线，第二张图是一致的图三是没对齐的排版，图四是对齐后的排版5.文字巨细与间距我们不是为蚂蚁设计的。
增加字体巨细将使你的内容更容易阅读和消化，并使用宽松的行间距。6.如果顺序很重要，可以使用列表的方式大多数移动端和网页端的应用法式都有几种搜索类型，而且在如何显示效果的问题上也存在一些有益的设计争论。
如果排序很重要，那么列表视图是最有效的结构方式。如果排序并不重要，你希望勉励用户自己发现新工具（如Pinterest或AirBnB），那么网格结构将勉励运用注视的方式来支持用户探索。7.首先设计黑白，再加色在黑白色中设计将重点解决和设计您的应用法式的焦点体验。
颜色引起强烈的情绪反映，经常中断我们专注于焦点设计问题的能力。8.缔造舒适的设计手部操作是个值得关注的问题，通过思考在用户体验专家Luke Wroblewski的文章：响应导航：优化跨设备的触摸操作底部的图表。Luke 排布了操作手机时最容易到达和使用的区域（至少对于右手来说是这样）——我很想看的应用法式有一个可以切换左右手使用习惯的设置。
许多有有效的移动设备应用法式将导航和焦点操作的区域保留在手机下方三分之一处。9.借用调色板颜色是一门难以捉摸的艺术。我强烈建议去Dribbble网站搜索Color Palettes或者使用像Coolors 或 Color Claim的颜色生成器。
节约你无休止的辩说和二次推测的时间。10.使用苹果和谷歌的操作守则苹果和谷歌给任作甚安卓或ios构建软件的人缔造了不行思议的资源。例如，谷歌质料规范拥有指导目标、资源、颜色、图标和组件，去资助你开始设计你的App。苹果公司拥有人机界面指南——他们的指南概述了如何设计一个IOS应用法式所需的一切。
请记着，设计需要训练训练你的眼睛去寻找设计中的问题，花一些时间去实践，你会发现上述提示会让你做出更好的设计。如果你认为这篇文章很有资助，请点击♥，并推荐分享给需要资助的朋侪。翻译：千校对：Effy注释：Effy。
本文关键词：“,学英语,”,给,设计,欧宝体育app官方入口,初学者,的,5分钟,指南
本文来源：欧宝体育app官方入口-www.buyingsea.com