Moos - 10 examples of online interactive experiences
22-02-22

10 examples of online interactive experiences

Most websites today look static and flat. It does not have to be like that. The following websites deliver memorable interactive experiences that invite you to act. Don't forget to click through to the examples to experience them yourself. Let's go!

1. Apple earpods

Apple is probably the company to look at when you are looking for good design. This page for the 3rd generation earpods starts off in typical apple style with bold titles that fly towards you. As you scroll further abstract shapes and bright colors greet you. This introduction adds a lot of emotion and excitement to the product page on what would otherwise be a flat static page.

Open website

2. Ikea kitchen configurator

This product configurator from Ikea lets you configure a kitchen and see the result right away. They could've gone with separate pictures of each part like many online stores do, but Ikea knows this wouldn't bring the same effect. Seeing your worktop next to your cabinets helps imagine how it would look in your house. Another nice touch is that you can see the price update when selecting a new part.

Open website

3. Bruno Simon resumé

Bruno Simon is a freelance developer that found an unconventional way to showcase his abilities. This mini-game acts like a fun playground that allows you to explore, learn about Bruno, and have fun. One challenge with these alternative experiences is that it might be unclear how to control them. Bruno solved this brilliantly by putting the instructions on the ground. Other strong points include adorable sounds and a fluid experience without hiccups.

Open website

4. Flying car concept

This shows a concept for a flying car. While scrolling through the page you see the car in multiple positions while the rotors are turning. The car feels alive and responsive to your actions. It is as if the dealer walks you around the car in real time instead of someone sending you pictures. A downside of many interactive experiences is that they don't work on mobile. This is a problem because more than half of consumers use a phone to access the web. This page get's around that and delivers a captivating experience, even on mobile.

Open website

5. We become what we behold

One way to share an idea is by telling it, another is by showing it. It is even more powerful to experience it, and that's exactly what this mini-game does. It starts out fun clicking around taking pictures. Along the way you get intensely focused as you need to be fast. While you furiously click around the screen it suddenly zooms out. That is the moment you get what the game is telling you. The surprise element makes this an intense experience. Such a powerful way to demonstrate an idea.

Open website

6. Original penguin store

It is not always possible to visit a store physically. The store might be far away or you just want to peek inside in anticipation of your trip. Being able to look around and click products while moving around might be the most immersive experience possible. If you click the building in the corner it allows you to fly over the store. This gives you a great overview of the store. You can imagine this coming in handy when lost.

Open website

7. The wild path

In written stories it is often difficult to understand where the character is going. This story shows you a map with on it the route taken. As you scroll through the story the map updates its location. A nice touch is that some of the view directions of the photos in the story are also shown on the map. Another is that a plane taken from one location to another is shown with an airplane symbol.

Open website

8. Scale of the universe

When you see a picture of a planet it can be difficult to imagine the sheer size of it. This example let's you see that planet in relation to other objects by zooming in and out. By using zooming a lot of information can be condensed in a small space.

Open website

9. Giveback 2019

It is often said that customers lose interest in a web page after only 7 seconds. To keep them engaged you need to invite them to scroll further. Lemonade did this with a playful line that dances over the screen while numbers shoot up. It is not just an animation playing, the dancing line really makes you want to go back and forth over the page making for a momorable experience.

Open website

10. just EGG

While video allows for impressive complex scenes it's continued nature can sometimes make it hard to digest information. One blink and you might have missed something. Advancing a video by scrolling makes it easy to follow at your own pace.

Open website

Wow, how do I make this?

Most of these examples were only possible with the hard work of experienced programmers. We at Moos have built a design tool that allows you to create interactive experiences without coding.

Check it out.

Newsletter

Receive emails about new features, company updates and cool projects (max 1/month).

test

Receive emails about new features, company updates and cool projects (max 1/month).

x