谷歌云指南

重点(Top highlight)

Google is one of the biggest and most influential players in the tech space, so it’s no mystery why their design system has a tremendous impact on how digital products are designed. The company’s Material design guidelines outline worthwhile principles for every designer to follow — regardless of whether they’re designing for iOS or Android.

Google是科技领域最大,最有影响力的公司之一,因此,为什么他们的设计系统会对数字产品的设计产生巨大影响,这并不神秘。 该公司的材料设计指南概述了每个设计师都应遵循的有价值的原则,无论他们是针对iOS还是Android进行设计。

In this piece, I’ll share key takeaways that I found while reviewing Material’s guidelines and provide my take on how best to execute their rules and methods. I’ll review best practices as laid out in the Material guidelines and share my own experience and tips for best practices when applying them to your products.

在本文中,我将分享在回顾Material指南时发现的关键要点,并就如何最好地执行其规则和方法提供我的看法。 我将回顾材料指南中列出的最佳做法,并分享自己的经验和将最佳做法应用于产品的技巧。

1.手势和动画来传达手势 (1. Signifiers & animation to communicate gestures)

Material材料实例
  • In the absence of other affordances, icons provide a clear indication that a gesture can be performed. — Material Gesture Guidelines

    在没有其他负担的情况下,图标可以清楚地指示可以执行手势。 - 材质手势准则

In The Design of Everyday Things, Don Norman, known as the father of human-centered design, defines signifiers as anything that indicates what actions are possible and how they should be done. In designing digital products, we don’t always need to be explicit with our signifiers and say things like “swipe left to view more.” Simple elements like icons, elevated containers, or colors can act as signifiers to prompt different gestures and actions.

《日常事物的设计》中,唐·诺曼(Don Norman)以人为中心的设计之父而闻名,他将指示符定义为任何指示可能采取何种行动以及应该如何采取行动的事物。 在设计数字产品时,我们并不一定总是要对指示符进行明确说明,而是说“向左滑动即可查看更多内容”。 图标,高架容器或颜色之类的简单元素可以充当指示不同手势和动作的标志。

  • Animate elements before the user interacts with them to suggest a gesture. — Material Gesture Guidelines

    在用户与元素进行交互以提出手势之前对其进行动画处理。 —材质手势准则

If we want to achieve a minimalist look, then we can get creative with animations to signify actions that users can perform. Occasionally, we can get away with no signifiers at all. Instead, we can show how to interact with an element by showing a quick animation. This practice should be used in a calculated way, but if used appropriately, it can greatly simplify an interface and even improve the experience.

如果我们想要达到极简主义的外观,那么我们可以通过动画来创意,以表示用户可以执行的动作。 有时,我们可能根本没有任何指示符。 相反,我们可以通过显示快速动画来演示如何与元素交互。 应该以一种有计划的方式来使用这种做法,但是如果使用得当,它可以大大简化界面,甚至改善体验。

2.动画图标 (2. Animated Icons)

by Eddy Gann
埃迪·江恩( Eddy Gann)
  • Animation reflects the action an icon performs in a way that adds polish and delight. Transitions connect animated icons between two visual states. Transitioning between two icons signifies that they are linked. — Material Animated Icons Guidelines

    动画反映了图标执行的动作,从而增加了光泽感和愉悦感。 过渡在两个视觉状态之间连接动画图标。 两个图标之间的过渡表示它们已链接。 —材质动画图标准则

Adding icon transitions indicates the relationship between two actions. A popular example is a play/pause button animation. When you click play, the icon turns into a pause button and vice versa. This change indicates the relationship between these two actions in a subtle but intuitive way.

添加图标过渡指示两个动作之间的关系。 一个流行的例子是播放/暂停按钮动画。 单击播放时,该图标变为暂停按钮,反之亦然。 此更改以微妙但直观的方式指示了这两个动作之间的关系。

That’s a simple example, but imagine how subtle animations can be used for more complex experiences like an add to cart interaction or displaying that functions are disabled. Creating animations between icons doesn’t need to be overly time-consuming, either. In Adobe XD, we can achieve a similar effect by using auto-animate and fading icons’ opacity in and out.

那是一个简单的例子,但是想象一下如何将微妙的动画用于更复杂的体验,例如添加到购物车交互或显示禁用的功能。 在图标之间创建动画也不需要太耗时。 在Adobe XD中,我们可以通过使用自动动画和淡入淡出图标的不透明度来达到类似的效果。

  • Animated icon transitions can use either simple or complex motion based on the level of emphasis preferred. Icons that aren’t prominent use a simple shared motion. Icons that are an important part of an app can be emphasized with complex motion. — Material Animated Icons Guidelines

    动画图标过渡可以根据首选的强调级别使用简单或复杂的运动。 不突出的图标使用简单的共享动作。 作为应用程序重要组成部分的图标可以通过复杂的动作来强调。 —材质动画图标准则

Bear in mind that if elements and icons are constantly animating, we risk overwhelming the user. Overuse also deadens emphasis, so we should use complex animations sparingly.

请记住,如果元素和图标在不断进行动画制作,则可能会使用户不知所措。 过度使用也会削弱重点,因此我们应该谨慎使用复杂的动画。

3.材质调色板生成器 (3. Material Color Palette Generator)

Material Color Tool
材质颜色工具
  • The Material palette generator can be used to generate a palette for any color you input. Hue, chroma, and lightness are adjusted by an algorithm that creates palettes that are usable and aesthetically pleasing. — Material Color System Guidelines

    材质调色板生成器可用于为您输入的任何颜色生成调色板。 色相,色度和亮度是通过一种算法来调整的,该算法创建的调色板既实用又美观。 —材料颜色系统准则

Trying to create a color palette from scratch can be tedious and often less effective (since you’d have to calculate the values yourself) than using a tool like Material’s Palette Generator (located near the bottom of the page).The best part is that the colors generated already meet accessibility standards, so you’re spared the hassle of checking your palette against WCAG guidelines. You should still probably double-check your designs with a plugin like Stark, though.

与使用Material's Palette Generator之类的工具(位于页面底部附近)相比,尝试从头开始创建调色板可能很繁琐且通常效率较低(因为您必须自己计算值)。生成的颜色已经满足可访问性标准,因此您无需麻烦对照WCAG指南检查调色板。 不过,您仍然应该使用Stark之类的插件仔细检查您的设计。

4.颜色 (4. Color)

As you’re considering colors and how to use them, Material also has strong tips and tools for using color in an interface.

在考虑颜色以及如何使用它们时,Material还提供了在界面中使用颜色的强大技巧和工具。

  • Show brand colors at memorable moments that reinforce your brand’s style. — Material Color System Guidelines

    在令人难忘的时刻展示品牌色彩,以增强品牌风格。 —材料颜色系统准则

Think of your brand colors like salt and pepper on a plate of avocado toast. Too much and it overpowers the natural flavors, too little and it’s bland. When adding colors to reinforce your brand to the interface, be thoughtful about when and where they’re added.

考虑一下您的品牌颜色,例如一盘鳄梨吐司上的盐和胡椒粉。 太多了,它压倒了自然风味,太少了,它却很乏味。 在添加颜色以增强品牌在界面上的效果时,请考虑添加颜色的时间和位置。

By limiting the use of color in your app, the areas that do receive color — things like text, images, and individual elements like buttons — will get more attention. You’ll notice that apps like Instagram and Twitter that feature many colorful posts and unpredictable content tend to have a pretty plain interface. This design element is subtle, but it takes the focus away from the interface in favor of the content.

通过限制颜色在您的应用程序中的使用,可以接收颜色的区域(如文本,图像和按钮等单个元素)将受到更多关注。 您会注意到,Instagram和Twitter之类的应用程序具有许多丰富多彩的帖子和不可预测的内容,它们的界面往往很简洁。 这个设计元素是微妙的,但它使焦点从界面移开,而转向内容。

  • Color indicates which elements are interactive, how they relate to other elements, and their level of prominence. Important elements should stand out the most. — Material Color System Guidelines

    颜色表示哪些元素是交互式的,它们与其他元素的关系以及突出程度。 重要元素应该最突出。 —材料颜色系统准则

When an element’s appearance contrasts with its surroundings, the user understands that it has greater importance than its surroundings. We can use color and color weight to establish a hierarchy within an interface. The weight of a color refers to how saturated that color is. More saturated colors will appear more vibrant and bold, thus giving them a greater visual weight.

当一个元素的外观与其周围环境形成对比时,用户会意识到它比周围环境具有更大的重要性。 我们可以使用颜色和颜色权重在接口内建立层次结构。 颜色的权重是指该颜色的饱和度。 饱和度更高的颜色将显得更有活力和更大胆,从而赋予它们更大的视觉效果。

More prominent, bolder information will draw the user’s eyes first, and then they will move on to the supporting information below it. If one element is more important than another, it should be of a greater visual weight. Thus, the user can quickly skim the page and distinguish between the various levels of importance.

更突出,更粗体的信息将首先吸引用户的眼球,然后他们将继续浏览其下方的支持信息。 如果一个元素比另一个元素更重要,则它应该具有更大的视觉重量。 因此,用户可以快速浏览页面并在各个重要级别之间进行区分。

5.物料类型标尺生成器 (5. Material’s type scale generator)

Material Type Scale Generator
物料类型秤生成器
  • Powered by Google Fonts, the type scale generator is a tool for creating type scales and corresponding code. Any font you choose is automatically resized and optimized based on Material typography guidance for readability.” — Materials Type System Guidelines

    由Google Fonts提供支持的类型比例尺生成器是用于创建类型比例尺和相应代码的工具。 您选择的任何字体都会根据材料印刷指南自动调整大小和优化,以提高可读性。” —物料类型系统准则

Typography involves much more than choosing a great font, when used effectively it can enhance usability by improving readability, accessibility, and hierarchy within an interface. Lucky for you, Google has a handy tool that will help save you time and frustration when developing your next typography guidelines — the Material type scale generator makes it dead easy to generate font sizes for paragraphs, headings, buttons, and so on.

字体设计不仅涉及选择出色的字体,而且涉及更多内容,当有效使用字体时,它可以通过提高界面的可读性,可访问性和层次结构来增强可用性。 幸运的是,Google提供了一个方便的工具,可帮助您在制定下一个排版指南时节省时间和沮丧的工作-材质类型比例生成器使生成段落,标题,按钮等的字体大小变得非常容易。

6.使用英雄的声音和触觉唤起情感React (6. Use Hero sounds & haptics to evoke emotional responses)

  • Hero sounds are representations of a product and brand that highlight an important moment, evoke an emotional state, or express celebration.

    英雄声音代表着重要时刻,唤起情感状态或表达喜庆的产品和品牌形象。

They occur in pivotal interactions, such as those that:

它们发生在关键的交互中,例如:

  • Celebrate a significant positive action the user has taken庆祝用户采取的重大积极行动
  • Welcome users to a new app or experience欢迎用户使用新的应用程序或体验
  • Confirm a key moment of a product’s purpose确认产品用途的关键时刻

— Materials Sound Guidelines

—材料声音准则

Sound can express a sense of success, accomplishment, or reward. Google recommends that “hero sounds occur infrequently, and because of their prominence, they should be applied in consistent ways.” By using the same success sound for each achievement, users will begin to recognize the chime and associate it with feelings of accomplishment. For instance, when someone has marked all the items on their to-do list as complete, a chime can acknowledge their success.

声音可以表达的成功,成就或奖励的感觉。 Google建议“英雄声音不常出现,并且由于声音突出,应以一致的方式应用它们。” 通过为每个成就使用相同的成功声音,用户将开始识别提示音并将其与成就感相关联。 例如,当某人将待办事项列表上的所有项目都标记为完成时,提示音便可以确认其成功。

Whether you realize it or not, you associate sounds with feelings. Whether it’s the ding your phone makes when you have a new message or the crumpling paper sound when you’ve emptied your trash on Mac, sounds can help us become more aware of what’s happening in an interface.

无论您是否意识到,您都将声音与感觉联系在一起。 无论是收到新消息时手机发出的叮叮声,还是在Mac上清空垃圾桶时发出的皱巴巴的纸张声音,声音都能帮助我们更加了解界面中发生的事情。

  • Haptics can be paired with other audio and visual elements, or used alone. For example, haptics can be the only method of feedback when a device has the sound turned off. When paired with other elements, haptics should be synchronized to create powerful and delightful expressions. — Android Haptic Guidelines

    触觉可以与其他音频和视频元素配对,也可以单独使用。 例如,当设备关闭声音时,触觉可能是唯一的反馈方法。 与其他元素配对时,触觉应该同步以创建有力且令人愉悦的表情。 — Android触觉准则

In addition to sounds, haptics (vibration or touch sensations) can also stimulate the senses to provide a more complete and enhanced user experience. Users learn haptics over time by experimenting and engaging with a product. After a few encounters with a sensation, we begin to associate different feelings with haptic patterns.

除了声音之外,触觉(振动或触摸感觉)还可以刺激感觉,以提供更完整和增强的用户体验。 随着时间的流逝,用户会通过试验和使用产品来学习触觉。 在遇到某种感觉后,我们开始将不同的感觉与触觉模式相关联。

For example, imagine that a user just submitted a payment, and it’s come back with an error. A feedback jolt indicating an error can be a learned experience that informs them of the status. If someone is familiar with that feeling from a past error, then they’ll immediately know that something has gone wrong.

例如,假设某个用户刚刚提交了一笔付款,但又返回了错误。 指示错误的反馈震荡可以是向他们告知状态的学习经验。 如果有人从过去的错误中熟悉这种感觉,那么他们会立即知道出了点问题。

Haptic feedback and hero sounds are two areas that product designers often miss. We focus heavily on the visual aspects while sometimes forgetting about the sounds and feelings that can add polish to a product.

触觉反馈和英雄声音是产品设计师经常错过的两个领域。 我们专注于视觉方面,有时却忽略了可以增加产品光泽度的声音和感觉。

7.用动作表达您品牌的个性和风格 (7. Use motion to express your brand’s personality and style)

Material材料实例
  • Motion celebrates moments in user journeys, adds character to common interactions, and can express a brand’s style.” — Materials Motion Guidelines

    Motion可以庆祝用户旅途中的时刻,为常见的互动增添特色,并可以表达品牌风格。” —材料运动准则

Motion is a key factor in my product, Confetti, a free habit tracker for people who want to be productive every day. While designing the product, I considered ways that I could communicate the relationship between states and create a sense of satisfaction when someone completes a habit. By putting an emphasis on motion, the product really stands out with its satisfying confetti animations and smooth transitions between the various displays.

运动是我的产品Confetti的关键因素, Confetti是一个免费的习惯跟踪器,适合想要每天提高工作效率的人们。 在设计产品时,我考虑了一些方法,可以用来沟通状态之间的关系并在某人养成习惯时营造一种满足感。 通过强调运动,该产品以其令人满意的五彩纸屑动画和各种显示之间的平滑过渡而真正脱颖而出。

Consider how motion can be used to emphasize different parts of an experience and add moments of delight or continuity through transitions and state changes.

考虑如何使用运动来强调体验的不同部分,以及如何通过过渡和状态变化来增加欢乐或连续性的时刻。

  • Motion design informs users by highlighting relationships between elements, action availability, and action outcomes. Motion focuses attention on what’s important, without creating unnecessary distraction. — Materials Motion Guidelines

    运动设计通过强调元素,操作可用性和操作结果之间的关系来通知用户。 运动将注意力集中在重要内容上,而不会造成不必要的干扰。 —材料运动准则

For users, speed and efficiency are of paramount importance. They’re using an application to solve a specific job to be done. If the experience of digitally depositing a check into a bank account is enjoyable, then that’s great, but don’t let your creativity get in the way of the user’s objective.

对于用户而言,速度和效率至关重要。 他们正在使用应用程序来解决要完成的特定任务。 如果将数字支票存入银行帐户的体验令人愉快,那很好,但是不要让您的创造力妨碍用户的目标。

In 2020 it only takes a millisecond to peeve your users. As Taras Skytski pointed out in “The Ultimate Guide to Proper Use of Animation in UX,”

在2020年,只需一毫秒即可激怒您的用户。 正如塔拉斯·斯凯斯基(Taras Skytski)在“ UX中正确使用动画的终极指南”中指出的那样,

“Numerous researches have discovered that optimal speed for interface animation is between 200 and 500 ms. These figures are based on the particular qualities of the human brain. Any animation shorter than 100 ms is instantaneous and won’t be recognized at all. Whereas the animation longer than one second would convey a sense of delay and thus be boring for the user.”

大量研究发现,界面动画的最佳速度在200到500毫秒之间。 这些数字基于人脑的特殊素质。 任何短于100毫秒的动画都是瞬时的,根本不会被识别。 而动画时间超过一秒钟将传达一种延迟感,从而使用户感到无聊。”

Being purposeful with animations can improve user experience, but adding unnecessary distractions and movement to elements will not. If the animations and micro-interactions add unnecessary time, then they’re not improving the experience. Being purposeful with animations can improve the experience, but adding unnecessary distractions and movement to elements will not.

有目的性地使用动画可以改善用户体验,但是不会给元素增加不必要的干扰和移动。 如果动画和微交互增加了不必要的时间,那么它们并不能改善体验。 有目的性地使用动画可以改善体验,但是不会给元素增加不必要的干扰和移动。

8.使用图像通过视觉传达和区分产品 (8. Use imagery to communicate and differentiate a product through visuals)

DribbbleDribbble上

We’ve all seen overcrowded interfaces with too much text and too few visuals. In UX design, it’s always better to show rather than tell. Users don’t want to read to understand — instead, show them imagery and allow them to experience the product visually.

我们都看到过分拥挤的界面,其中包含太多的文本和太少的视觉效果。 在UX设计中,总是显示而不是讲述总是更好。 用户不想阅读以理解,而是向他们显示图像并允许他们直观地体验产品。

  • Images should be selected for their ability to express your message and reflect your product’s style. Whether you use user-generated photography, professional photography, or different styles of illustration, they should all lend a look and feel that reflects your product. ” — Material Imagery Guidelines

    应该选择图像来表达您的信息并反映您产品的风格。 无论您使用用户生成的摄影作品,专业摄影作品还是不同风格的插图,它们都应具有能反映您产品的外观。 ” —实物图像准则

The images in your application are just as important as any of the other visual elements. The visuals you select can enhance your UI by making it more vibrant and lively. They can also help establish our brand and work as a story-teller for our interface.

应用程序中的图像与任何其他视觉元素一样重要。 您选择的视觉效果可以使UI更加生动生动,从而增强您的UI。 他们还可以帮助建立我们的品牌并充当我们界面的讲故事者。

Imagery should be used purposefully and serves as an addition to the content, not a replacement. Imagery or illustrations are best used to explain how to use an application or to communicate the system status. As they say, an image is worth 1,000 words. If you want images for your designs, here are a few of my favorite places to find high-quality imagery:

图像应有目的地使用,并且应作为内容的补充,而不是替代。 最好使用图像或插图来说明如何使用应用程序或传达系统状态。 就像他们说的那样,一张图片价值1,000字。 如果您想要设计的图像,请在以下我最喜欢的地方找到高质量的图像:

  • Unsplash

    Unsplash

  • Pexels

    像素

  • Freepik

    Freepik

  • Adobe Stock

    Adobe Stock

  • Pixabay

    Pixabay

9.材质使用与密度无关的像素 (9. Material uses density-independent pixels)

Example from Material材料实例
  • Material UIs use density-independent pixels to display elements consistently on screens with different densities. — Material Pixel Density Guidelines

    材质UI使用与密度无关的像素来在具有不同密度的屏幕上一致地显示元素。 —材质像素密度准则

Density is the number of pixels per inch of a screen, also known as PPI. The unit “dp” is short for “density-independent pixel,” also sometimes abbreviated as “dip.” Screen density = Screen width (or height) in pixels / Screen width (or height) in inches.

密度是屏幕每英寸的像素数,也称为PPI。 “ dp”单位是“密度无关像素”的缩写,有时也缩写为“ dip”。 屏幕密度=屏幕宽度(或高度)(以像素为单位)/屏幕宽度(或高度)(以英寸为单位)。

When designing an interface, it’s recommended that we don’t design for pixels, but rather for the device’s pixel density. This ensures that our elements are appropriately scaled to fit different device sizes.

在设计接口时,建议不要为像素设计,而应为设备的像素密度设计。 这样可以确保我们的元素适当缩放以适合不同的设备尺寸。

We do this, so if we design a button asset, for example, at 200 x 50 dp, it’s displayed at 200 x 50 px on a 160ppi screen and 400 x 100 px on a 320 ppi screen, or 2x the size of the original asset.

我们这样做,因此,如果我们设计一个按钮素材资源,例如200 x 50 dp,则在160ppi屏幕上以200 x 50 px显示,在320 ppi屏幕上以400 x 100 px显示,即原始大小的2倍资产。

Since some screens have more pixels per inch than others, the assets aren’t displayed smaller on screens with a high pixel density; they’re rendered at 2x, 3x, 4x their original size. This makes sure that all assets maintain their sizing across different devices with varying densities.

由于某些屏幕每英寸的像素要多于其他屏幕,因此在像素密度高的屏幕上资产不会显示得更小; 它们以原始大小的2倍,3倍,4倍进行渲染。 这样可以确保所有资产在具有不同密度的不同设备之间保持其大小。

How does density translate to screen size? The dimensions for the iPhone XS Max’s screen, for example, is 414 x 896. But tha size is in points, not pixels. In pixels, it’s 1242 x 2688 px. With that in mind, when designing for the iPhone XS Max, I would design at 414 x 896 points and then deliver assets at 3x.

密度如何转换为屏幕尺寸? 例如,iPhone XS Max的屏幕尺寸为414 x896。但是tha的大小以磅为单位,而不是像素。 以像素为单位,为1242 x 2688像素。 考虑到这一点,在为iPhone XS Max进行设计时,我会以414 x 896点进行设计,然后以3倍的速度交付资产。

10.考虑离线状态 (10. Consider offline states)

Material材料
  • Offline states allow users to interact with an app without internet access. If your app has features that are available when offline, and other features that aren’t, it should indicate whether it’s current state is offline or online. — Material Offline Guidelines

    离线状态允许用户无需访问互联网即可与应用交互。 如果您的应用具有离线状态下可用的功能,而其他功能则不可用,则应指示其当前状态为离线还是在线。 —重大离线指南

Having offline access capabilities in our products is an often overlooked but immensely beneficial experience for users. Although every aspect of a product might not work without internet connectivity, it’s better to have some access than none.

对于我们的产品而言,具有脱机访问功能是一种经常被忽视但非常有益的体验。 尽管没有互联网连接,产品的每个方面都可能无法正常工作,但是最好能进行某些访问而不是没有访问权限。

If possible, allow users to download information for offline access. A perfect example of this is music apps like Spotify, which allow you to download songs so you can be prepared if you know you’re going to have little or no connection.

如果可能,允许用户下载信息以供脱机访问。 一个很好的例子就是Spotify之类的音乐应用程序,它允许您下载歌曲,以便在知道几乎没有连接或没有连接的情况下做好准备。

Alternatively, if your product doesn’t have consumable content like Spotify or Netflix, get creative with how you can turn “no connection” into a memorable experience.

另外,如果您的产品不包含Spotify或Netflix等消耗性内容,请发挥创意,将“无连接”变成难忘的体验。

Google Chrome’s offline screen is probably the most notable example with its beloved T-Rex game. By providing a touch of personality or enjoyment, we can turn an often negative experience into a positive one.

谷歌浏览器的离线屏幕可能是最受欢迎的霸王龙游戏中最著名的例子。 通过提供一种个性或乐趣,我们可以将通常是消极的体验变成积极的体验。

I hope you enjoyed this short review of some important points mentioned in Material Design. I have inevitably missed crucial points, so I would recommend reviewing the guidelines yourself. Check out other design systems, too, like IBM Carbon, Zendesk Garden, Workday Canvas, and Atlassian. Reading design documentation from popular design systems is a foolproof way to gain more tactical UI/UX knowledge.

我希望您喜欢对材料设计中提到的一些要点的简短回顾。 我不可避免地错过了关键点,因此我建议您自己仔细阅读指南。 还可以查看其他设计系统,例如IBM Carbon , Zendesk Garden , Workday Canvas和Atlassian 。 从流行的设计系统中读取设计文档是一种获得更多战术UI / UX知识的万无一失的方法。

I hope you enjoyed this short review of some important points mentioned in Material Design. I have inevitably missed crucial points, so I would recommend reviewing the guidelines yourself. Check out other design systems, too, like IBM Carbon, Zendesk Garden, Workday Canvas, and Atlassian. Reading design documentation from popular design systems is a foolproof way to gain more tactical UI/UX knowledge.

我希望您喜欢对材料设计中提到的一些要点的简短回顾。 我不可避免地错过了关键点,因此我建议您自己仔细阅读指南。 还可以查看其他设计系统,例如IBM Carbon , Zendesk Garden , Workday Canvas和Atlassian 。 从流行的设计系统中读取设计文档是一种获得更多战术UI / UX知识的万无一失的方法。

谷歌云指南_Google材料设计指南的10个重要要点相关推荐

  1. android app底部菜单栏,材料设计指南·组件篇(一):AppBars: Bottom 底部栏

    写在前面的话:内容来自 Material IO ,目前不是从头到尾一一翻译,我自己用到哪部分内容就翻译哪部分.之后会逐步完善,当然你要想先看哪部分也可以留言提要求.不是直译,但不会影响原文内容. 材料 ...

  2. 谷歌云服务_Google Cloud_使用注意

    谷歌云服务_Google Cloud_使用注意 谷歌云服务_Google Cloud_使用注意 使用前提 SDK使用 REST api使用 谷歌云服务_Google Cloud_使用注意 因为近期工作 ...

  3. google谷歌云盘_Google舞蹈综合症

    google谷歌云盘 Good stuff-just the thing my buddy Adam Cogan is looking for as he dances to the top of t ...

  4. google谷歌云盘_Google 12岁生日快乐

    google谷歌云盘 It's Google's 12th Birthday. You'd probably realized that if you've visited the search en ...

  5. google谷歌云盘_Google诗歌中的冬天

    google谷歌云盘 Seasonal decoration and localization have been discussion points around the SitePoint off ...

  6. 面向制造和装配的产品设计指南 Ch.2 学习笔记

    第2章 面向装配的设计指南 2. 2 设计指南 2.2.1 减少零件数量 1. 考察每个零件,考虑去除零件可能性 2. 相邻零件合并 3. 相似零件合并 4. 对称零件合并 5. 避免过于稳健的设计 ...

  7. google api设计指南-简介

    简介 这是联网 API 的通用设计指南.它自 2014 年起在 Google 内部使用,是 Google 在设计 Cloud API 和其他 Google API 时遵循的指南.此设计指南在此处共享, ...

  8. APP界面设计指南|APP界面设计师必备信息图

    013年,APP界面设计已经越来越受到大家的关注和热捧!作为一个接触APP界面设计的老鸟,网站设计师们.一定得记住:用户体验设计放在首位! 信息图:移动端APP设计指南 APP界面设计指南|APP界面 ...

  9. 触摸传感器PCB布局设计指南(二)

    触摸传感器PCB布局设计指南(二) 接着上一篇文章触摸传感器PCB布局设计指南(一)本文继续讲解与多种PCB类型相关的设计和布局指南.                                 ...

最新文章

  1. Java学习总结:25
  2. CSS display overflow 属性 cursor光标类型
  3. Web.xml 文件与server.xml 文件使用总结
  4. ajax静态页面实例,AJAX实例:Ajax实现静态页面分页
  5. MySql like 查询 变向写法(不用like 完成like查询)
  6. 远控免杀专题(19)-nps_payload免杀
  7. Python计算校验文件的MD5、SHA1、SHA256和CRC32,获取文件创建日期、修改日期和文件大小
  8. mysql偏差聚集_My SQL聚合函数
  9. 我有一朋友生意做的红红火火
  10. 【LeetCode】026. Remove Duplicates from Sorted Array
  11. Flink 1.10 和 Hive 3.0 性能对比(附 Demo 演示 PPT)
  12. 十五、static关键字
  13. 为什么打印出来的文件右边有阴影_怎样将十几几十页的长文件文档打印成A4纸对折的小册子?...
  14. mysql msvcp140.dll修复_丢失msvcp140.dll怎么办
  15. 带你了解一下什么是SaaS平台
  16. Window 任务栏里面Idea图标出现空白
  17. maven BUILD FAILURE的解决办法
  18. 利用autossh反向代理实现内网穿透
  19. 计算机课程实训总结,计算机实训总结优秀范文
  20. Unity编辑器拓展之三:拓展Unity的Hierarchy面板

热门文章

  1. Python 自动化操作 Excel 绘制条形图!
  2. 红黑树(算法导论版)
  3. Jekyll 教程——安装
  4. K、KB、M、MB、G、GB 、TB
  5. (完结)Unity游戏开发——新发教你做游戏(七):Animator控制角色动画播放
  6. 贝塞尔曲线-曲线拟合
  7. windchill 系统客制角色
  8. RTX 4070TI和RTX 3090TI性能哪个好 RTX 4070ti和RTX3090ti 差距
  9. IOS按钮排列自动换行
  10. 【十大思想实验之一】电车难题