lunch and learn : 5 website trends in 2016

Lunch and Learn: 5 Web Design Trends for 2016February 19, 2016

Agenda

1. FLAT DESIGN 2.0

2. MOBILE FIRST

3. MICROINTERACTIONS

4. ANIMATIONS

5. FRESH IMAGERY

6. FINAL THOUGHTS

2

FLAT DESIGN 2.0

3

A Quick History Lesson

Before Flat Design came along, there was something called skeuomorphism.

4

Interface elements are made to look like their physical counterparts.

A Quick History Lesson

Eventually, the world got tired of it. So designers pulled a complete 180.

5

Gone are the gradients and leather stitching!

Introducing Flat Design 2.0

AKA skeuomorphism and flat design’s baby

6

Google’s Material Design is one example with subtle shadows and highlights.

MOBILE FIRST

7

Mobile > Desktop Usage

As a result, more websites are being designed with mobile in mind from the start.

8

Mobile Desktop

Note the differences.

The mobile version of the site is still a great experience.

9

MICROINTERACTIONS

10

Details, details, details

A microinteraction is a moment with a product to accomplish a single task.

11

Microinteractions:

1. Communicate status and feedback to the user

2. Educate the user about the outcome of her actions

3. Makes or breaks the user experience

12

ANIMATIONS

13

Animations

The idea of moving elements on a page is not new. (Flash anyone?)

14

So why are animations trending?

1. Recent CSS developments make them easy to implement

2. They make websites more dynamic

3. Animations enhance microinteractions

15

FRESH IMAGERY

16

RIP the Cheesy Stock Photo

17

Time to switch it up!

18

Conclusion: More natural and custom imagery

FINAL THOUGHTS

19

Final Thoughts

1. Exercise caution when following a trend.

2. It’s all about the user.

3. The future lies in digital products acting more like humans.

20

Questions?info@one-400.com

(626) 578-5040

@one_400