Line25

20 Great Examples of Subtle Motion in Web Design

Read the full post

Two modern technologies of CSS/JS animation and HTML5 video allow designers to add awesome motion effects to their web designs, common examples being large background videos or web elements that move into place. These effects don’t always have to be so obvious though, which today’s featured websites prove. Subtle motion and animation can really enhance a design without being too distracting. Check out these 20 web designs that make use of clever video loops, animated objects and particle effects.

AQUATILIS EXPEDITION

AQUATILIS EXPEDITION

Little Forge

Little Forge

BarCamp Omaha 2014

BarCamp Omaha 2014

WILD

WILD

Nerisson

Nerisson

Dragone

Dragone

Blu Homes

Blu Homes

LETTERS, INC.

LETTERS, INC.

Omnisense

Omnisense

INDUSTRY

INDUSTRY

The Beauty of Brewing

The Beauty of Brewing

Bicycle Speed Shop

Bicycle Speed Shop

Thermodo

Thermodo

Bellroy

Bellroy

Siberia

Siberia

Carbure Digital Workshop

Carbure Digital Workshop

The Fernway

The Fernway

High Tide

High Tide

  • 187
100 HD Blurred Backgrounds

Join the mailing list to have new content delivered straight to your email inbox. Every subscriber gets a free pack of 100 HD Blurred Backgrounds + bonus 10 realistic web shadows.

100 HD Blurred Backgrounds

Written by Iggy

Iggy is a designer who loves experimenting with new web design techniques collating creative website designs. Check out Iggy's design tutorials and articles at his Web Design Blog or follow his daily findings on Twitter.

37 Comments

  1. Really very nice post Chrish. Motion effects can be used in all sectors be it for a serious cause or something lighter such as social awareness programs, child education, gaming sectors training sectors or in entertainment sectors etc.

  2. Debarpan says:

    I like that wild.This one is superb

  3. sham says:

    some of the web are not responsive. usability is more important than a good look.

  4. SHS Services says:

    Totally agree with your idea about motion and animation can really enhance a design and it sure helps engage the person.

    Regards,

    Sabir

  5. Alex Periera says:

    Great work Chris! I especially loved blu homes and Siberia. Honestly, I have got a weakness for sleek and modern designs.

  6. lee vogue says:

    hi chris your web design experiment is awesome i like . i especially loved high tide ,Bicycle Speed Shop.

  7. Good Job ,it is a great site.

  8. Namita says:

    Nice article. This article is going to help those people who want to add some kind of motion in their blog.

  9. Ваше Имя says:

    ячссячс

  10. ArvindSoni says:

    Very nice post Mr. Chrish. your web design experiment is good

  11. John Donavan says:

    Indeed good collection. i would wonder how would be the IT firms working without CSS/JS animations as well as HTML videos. CSS is required everywhere moreover for development of any website these things are must.

  12. Rosie says:

    Very is very creative idea and implementation.

  13. DigitalCusp says:

    Good stuff, I think we should have to try this.

  14. طراحی سایت says:

    blu homes better than all
    do you make like this motion ?

  15. Nice post,thank you for sharing!

  16. thank you for your sharing

  17. AIMIT web solution means the king of domain web hosting company in Chennai. Domain web hosting is a term used to describe what people are looking for, when they decide to use a web hosting company, where you add a domain name. When you buy a domain name, you buy it and register it with a domain name registrar company, usually for one year, but you have the option to buy for up to ten years if needed. AIMIT web solution are glittering in so many names like best website design company in Chennai, best ecommerce development company in Chennai ,best CMS development company in Chennai ,best online marketing company in Chennai etc.
    http://aimitwebsolutions.com/web-design-services.php

  18. Rath says:

    I loved all your animation and motion in your posting but the dragon animation sprinkles me like a heaven.There is no words to express your imagination!

  19. تور کیش says:

    great and interesting
    many thanks

  20. Krystle says:

    I am obsessed with these as I am seeing this everywhere now. Must learn!! Great post.

  21. jp says:

    By far the most impressive one there was the Omnisense.

  22. Web Designer says:

    These are some great examples, good web design is tricky when done right it is barely noticeable and when it is done wrong everyone notices it. I think it is very important to carefully manage color and animations.

Leave a response