请选择 进入手机版 | 继续访问电脑版

产品设计

    今日:36| 主题:19130
收藏本版 (1)
软件产品、PC、移动、网站、平台的开发、策划等内容。

[其他] Essential design trends, October 2016

[复制链接]
甩的就是男人 发表于 2016-10-8 04:30:15
300 7

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

Essential design trends, October 2016

Essential design trends, October 2016-1-产品设计-designers,actually,elements,question,display

  As the saying goes: Everything old is new again. That’s true in design for sure. This month some of the biggest trends in web design aren’t that new at all. Designers are reinventing old-school typography styles, returning to the grid and rethinking messaging on the home page.
  It’s an interesting combination of visual elements that we’ve seen in the past, and will probably see again in the future. Here’s what’s trending in design this month:
  1. Old school typography

  More designers are taking an old-school approach to display typography. Gone are the ultra-thin or condensed sans serifs, and more traditional type styles are in. Old-style, modern and transitional serifs are the new go-to display type style.
  It’s a bit surprising, actually. For years. The “rule” has been to use sans serifs to improve readability and designers did just that, often without question. The new use of serifs for big type — and even some smaller type — is refreshing and quite readable. The designs often live in a minimal space, so that type does not have to compete for attention and pairings focus on dark lettering on a light background. (All things that aid readability.)
  Don’t know much about these type styles? Here’s a quick primer on each of these “new” old-school serifs:
  
       
  • Old-style: Lettering has an old-world vibe that carries over from some blackletter and gothic styles from early ages of printing. Letterforms often have small serifs (those tiny strokes at the end of longer stokes) and a rounded form. RSQ, below, is a perfect showcase of old-style typography.   
  • Modern: This style of lettering is quite common in printed design, such as newspapers and magazines, but is just starting to make its way into web projects. Modern serifs have alternating thick and thin stroke widths in each letterform, sometimes with great amounts of contrast. Ink + Volt, below, uses a beautiful modern serif. But also note how the lettering is used. The type is inside of a white box so that the thin parts of each letter do not get lost in the video background, which would limit readability. This is the perfect solution for using a modern serif.   
  • Transitional: These letterforms look a lot like modern serifs with one big difference – letters have uniform stroke widths. This makes traditional serifs easier to use because they can be more readable in more design situations.  
  Not all old-school typography falls into a serif category. Some of the old-school styles that are popping up just remind us of another time, such as that used by The Frontend Guide, below. The funky, tilted, late 1970s-early 80s theme really does take you to another time and place. (And that’s totally old-school.)
   

Essential design trends, October 2016

Essential design trends, October 2016-2-产品设计-designers,actually,elements,question,display

   

Essential design trends, October 2016

Essential design trends, October 2016-3-产品设计-designers,actually,elements,question,display

   

Essential design trends, October 2016

Essential design trends, October 2016-4-产品设计-designers,actually,elements,question,display

  2. Defined grids

  Sometimes you can see the grid, sometimes you can’t. Either way, a solid grid is the foundation for a design that’s clean organized and easy on the eyes.
  More defined grids are making a comeback. Part of it might be from the influence of Material Design, which features plenty of elements in neat columns and rows, and part of it might be the ease of moving and rearranging elements in responsive frameworks.
  Either way, defined grids can look amazing for a variety of projects on pretty much any screen. What’s nice about using a defined grid that is that it makes life really easy for the designer. Once you get the hang of working within a grid, placements, sizing and design options clearly present themselves to you.
  The trick to using defined grids is not to look too structured or overly-gridded. For many designers this means switching up sizes on different “screens,” such as having a full width hero image over a grid of elements. The Elegant Seagulls “Decade” page, below does this nicely. The website also features subtle gridding on the homepage in the picture, which is dark any mysterious, leading you into the mystery-themed grid pages. High Tide, below, does something similar with a cool intro video above grid blocks.
  But a grid can be well-defined and a little less boxed. Zumtobel, below, uses the letters in its named to create grid blocks for specific product information. Only on hover do you see the perfectly sized grid boxes, even though the placements are ideally spaced horizontally and vertically in a clean grid.
  The more you think about grids, the more you will start to see them through the eyes of the designer who created each one. You can start with some of the common web grids if you aren’t comfortable with the idea or create your own. The trick is that you have to use the grid consistently for real visual success.
   

Essential design trends, October 2016

Essential design trends, October 2016-5-产品设计-designers,actually,elements,question,display

   

Essential design trends, October 2016

Essential design trends, October 2016-6-产品设计-designers,actually,elements,question,display

   

Essential design trends, October 2016

Essential design trends, October 2016-7-产品设计-designers,actually,elements,question,display

  3. Minimal messaging above the “fold”

  The question of the day is this: Is there enough information above the scroll to interest you enough to keep looking at the website? It can be tough to answer. But plenty of designers are betting on the idea that you will click or scroll, even if there is only one word on the screen.
  With other visuals such as video, scrolling sliders or enticing product displays, users might do just that. But it can be a gamble, especially with designs that don’t include a navigation menu with minimal messaging.
  Then there’s this: Plenty of users enter websites through pages other than the homepage, so why not take a risk there? Look at the data and clicks, see what happens.
  This is one of those trends that will be interesting to watch. It could vanish almost as quickly as it has appeared, but there are a lot of sites using this model.
   

Essential design trends, October 2016

Essential design trends, October 2016-8-产品设计-designers,actually,elements,question,display

   

Essential design trends, October 2016

Essential design trends, October 2016-9-产品设计-designers,actually,elements,question,display

   

Essential design trends, October 2016

Essential design trends, October 2016-10-产品设计-designers,actually,elements,question,display

  Conclusion

  It’s a lot of fun to watch design trends cycle back into fashion. What’s nice about two of these trends — old-school typography and defined grids — is that they are highly usable in a number of design styles.
   What trends are you loving (or hating) right now? I’d love to see some of the websites that you are fascinated with. Drop me a link on Twitter ; I’d love to hear from you.



上一篇:Affinity Designer 1.5
下一篇:The Future of Immersive Environments: Virtual Home Design, “Backcasting” the F .
111111111112222 发表于 2016-10-9 12:12:25
幸福毕竟不是曹操,怎能说到就到。
回复 支持 反对

使用道具 举报

千易 发表于 2016-10-9 13:51:05
明明白白我的心,楼主赏我个沙发!
回复 支持 反对

使用道具 举报

白白白白. 发表于 2016-10-9 15:23:58
不要和我比懒,我懒得和你比.
回复 支持 反对

使用道具 举报

kfaqk 发表于 2016-10-10 23:52:02
土豪,交个朋友
回复 支持 反对

使用道具 举报

姜鹏 发表于 2016-10-15 09:32:18
干掉鸟人我就是天使.
回复 支持 反对

使用道具 举报

mymyth1990 发表于 2016-10-16 15:58:03
出问题先从自己身上找原因,别一便秘就怪地球没引力.
回复 支持 反对

使用道具 举报

aiqiu123 发表于 2016-10-17 13:45:12
叮铃叮铃,楼主开门,我是送快递的!
回复 支持 反对

使用道具 举报

*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读


回页顶回复上一篇下一篇回列表
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )

© 2001-2017 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表