原作者：Ryan Bales
翻译：Ely（作者）
文章地址：https://medium.muz.li/the-evolution-of-ui-design-on-dribbble-732de40a30e6
几乎从一开始，我一直在使用Dribbble。我花了一段时间来获得邀请资格，为此我尽可能发布我的作品（感谢Rich），但是回顾Dribble在刚建立的时候，早在2009年，Dribbble更多的是关于UI和网页设计的插图。过去几年的潮流已经转变，插图更多了。看看dribble的主页，你就会明白我的意思了。虽然我也不知道发生了什么事。
尽管如此，Dribbble在UI设计领域已经有了巨大的影响力，所以我想特别谈谈UI设计在Dribbble作品反映的多年来的演变。
Pro Tip: Want to see the first players and shots on Dribbble? Try these URLs
1st Player: https://dribbble.com/1
1st Shot: https://dribbble.com/shots/1
2nd Shot: https://dribbble.com/shots/2
当然还有许多......
在我看来，Dribbble上的UI设计作品，有三种主要的风格转变。让我们来看看每一个吧，我会描述一些特点和展示的例子。我不是设计趋势方面的专家，所以如果我不使用花哨的流行语来描述某种设计风格，那么请原谅我。我相信有人会在评论中说这些。
Shots Between 2009 and 2012
Traits：
- Skeuomorphic（拟物化）
- Gradients （渐变）&shadows（阴影）used on elements to create depth
- Liberal use of textures （纹理）and repeating patterns（重复）
- Toned down color palettes, lots of gray, dark blues.
- Shiny buttons（明亮的按钮）
Examples:
https://dribbble.com/shots/151314-Fantastical
https://dribbble.com/shots/306311-UI-Kit
https://dribbble.com/shots/92791-Experimenting-with-Miro-4-chrome-OSX-app-interface-UI-UX
https://dribbble.com/shots/340599-iPhone-Traveling-App
https://dribbble.com/shots/424369-Dialoggs-Hidden-Navigation
Shots Between 2013 and 2015
Traits:
- Flat design (i.e., little or no gradients, shadows, or highlights)(扁平的设计)
- Color palettes get brighter, more pastel.（调色更明亮更柔和）
- Skeuomorphism is dropped.
- Textures and patterns aren’t used.（不使用文理和图案）
*Minimalism returns（极简设计）
*Thin/Extra Thin typography is used more often.（更常使用较细的字体）
Examples:
https://dribbble.com/shots/1625429-Helpdesk
https://dribbble.com/shots/1174646-UI-Elements-Formula-Builder-Concept
https://dribbble.com/shots/947749-Task-app
https://dribbble.com/shots/1135984-Flat-Design-UI-Components
https://dribbble.com/shots/1002972-Juiiicy-s-Flat-payment-page-design
Shots Between 2016 and Now (2017)
Traits:
- Gradients and shadows return but are used to soften the design rather than add realistic depth.
- Colors become even more pastel.
- Bolder typography returns.
- Liberal use of drop shadows on block elements.
- Flat icons.
Examples:
https://dribbble.com/shots/2227334-Social-calendar-app-mobile
https://dribbble.com/shots/3173213-payment-dashboard
https://dribbble.com/shots/3219163-Trello-Atlassian-Redesign
https://dribbble.com/shots/3257206-Pet-Tracker-Dashboard-Concept
https://dribbble.com/shots/3307105-Juno-Nutrition
Dribbble设计模式还会转变吗？
我认为有必要问一下Dribbble的作品是否仅仅反映了平台之外的设计的总体演进，或者Dribbble是否已经成为实际上促使了这些模式转换的驱动因素。你怎么看？
了解UI设计在未来几年如何继续发展将会很有趣。让我知道你是否注意到了相同的趋势，以及你认为UI设计接下来会发生什么。
Ryan Bales是Bync.com的创始人和创意总监。他拥有超过15年的设计经验，专注于数据可视化，数据重型网站和移动应用程序的设计。
你可以在Dribbble上找到他：http://dribbble.com/ryanbales。
网友评论