Image preview: 25 Totally Immersive Web Experiences

25 Totally Immersive Web Experiences

I’ve selected 25 websites that totally immerse the viewer, drawing them into their design, and breaking traditional web conventions.

Read More... 12 comments

Most websites feel to us like they are websites – that is to say, a collection of graphics and text arranged in an attractive manner. However, some websites go beyond this, and become more of a ‘web experience’ than a basic web design. By ‘web experience’ I mean sites that completely immerse you, and make you forget that you are browsing a website.

It’s a fine art to make your visitors unconscious to the fact that they are browsing a website, to make them truly feel like they are in a different environment or setting. To achieve this, designers seem to use some, or all of the various techniques laid out below:

3d elements and depth/perspective:

Often immersive designs will make use of 3d elements (be it photos or illustrations). By breaking from the traditionally flat, 2d web experience, and making the page seem to be 3d, they are able to draw the viewer in on a whole new level. This can also be achieved by juxta-positioning 2d elements to create depth. For instance, you can have 2d elements overlapping each other, and shrinking as they move into the ‘distance’, – this creating a feeling of perspective.

Textures

Textures are great for immersing a visitor in the ‘feel’ of a certain environment. If the website feels like a collection of surfaces, rather than images, it will feel a lot more real to your viewers. Textures also help evoke the relevant moods for each setting. For instance, if you’re trying to immerse your visitor in the environment of a motorbike shop, then leathers and metals should help them feel more involved in this setting than regular flat photos and blocks of color.

Photos

Often immersive designs will use huge photos (often taking up the entire background) in order to give the visitor a kind of panoramic view. This works best with large landscape scenes, used particularly on holiday/leisure sites, as your internet browser becomes like a dream view from a vacation.

Breaking Conventions

A great way to make a web page more immersive is to break traditional website conventions. By departing from regular web design practices, the viewer will not pick up on these traditions that trigger the response ‘this is a website’. For example, very immersive websites rarely include any white backgrounds. White backgrounds are the most popular website background color, and whilst they are good for readability, they do create a very flat feeling. Immersive ‘web experiences’ fill these white backgrounds with photos, textures, or darker colors, so that the viewer’s eye is drawn further into the page, rather than viewing it as a flat whole.

Other conventions include breaking traditional page layouts, whereby instead of presenting the traditional logo-top left, menu – top middle, layouts explore other possibilities.

What’s your opinion

Of course the following examples are just websites that I feel particularly immersed in. I would love to hear your opinions on what makes a truly immersive web experience, and if you agree with my points, or examples.

Examples of Immersive Design:

Schneider Garten
imm1 25 Totally Immersive Web Experiences

The Bug World Experience
imm2 25 Totally Immersive Web Experiences

Go Summer Project
imm3 25 Totally Immersive Web Experiences

Gozz
imm4 25 Totally Immersive Web Experiences

Serial Cut
imm5 25 Totally Immersive Web Experiences

Bulls Boars n Barra
imm6 25 Totally Immersive Web Experiences

CCC Celt
imm7 25 Totally Immersive Web Experiences

Orca Bay Seafoods
imm8 25 Totally Immersive Web Experiences

Hotel-Prestige
imm9 25 Totally Immersive Web Experiences

Votaw
imm10 25 Totally Immersive Web Experiences

Bently Reserve
imm11 25 Totally Immersive Web Experiences

Cedevitago
imm12 25 Totally Immersive Web Experiences

Frizo
imm13 25 Totally Immersive Web Experiences

C Galvin
imm14 25 Totally Immersive Web Experiences

Villa Bianca Hotel
imm15 25 Totally Immersive Web Experiences

Rainbow Cleaners

Agota
imm17 25 Totally Immersive Web Experiences

Hellenic Holidays
imm18 25 Totally Immersive Web Experiences

Creative Spaces
imm19 25 Totally Immersive Web Experiences

Nuevo Aurich
imm20 25 Totally Immersive Web Experiences

Falk Adventures
imm21 25 Totally Immersive Web Experiences

Magnolia Park
imm22 25 Totally Immersive Web Experiences

Future Talent
imm23 25 Totally Immersive Web Experiences

Zoosa – Adelaide Zoo
imm24 25 Totally Immersive Web Experiences

Creative People
imm25 25 Totally Immersive Web Experiences

About the Author: Tom is the founder of PSDFAN. He loves writing tutorials, learning more about design and interacting with the community. On a more interesting note he can also play guitar hero drunk with his teeth.

12 Awesome Comments: Leave Your Comment

  1. User GravatarAbounding 8th July 2009

    I have to say the Bug World Experience site is my favorite. The video integration is just so cool. Immersive is a good word for it.

  2. User Gravatardragyn 9th July 2009

    the bug world is so interesting and grabs your attention right away. Great example of web experience.

  3. User GravatarDaniel 9th July 2009

    The first one is great. I’ve just completed a garden center website, wish I’d seen this before and taken some ideas from it.

  4. User GravatarIrene 9th July 2009

    I reccomend this one too. We went there last spring, and after seeing their website I was even more spellbound :)

    Skjerjehamn

  5. User GravatarTom 9th July 2009

    That’s interesting how the Bug World one seems to be a favorite. It wasn’t one of my favorites from this list, although it is an awesome design. I really like the Villa Bianca Hotel site, the flying birds animation is incredible.

    Irene: Yeah that site has a pretty nice background image. Thanks for sharing :) .

  6. User GravatarMondo Jay 9th July 2009


    Great list,
    I really like the Schneider Garten website…
    Keep up the good work.

  7. User GravatarAdam 9th July 2009

    It’s amazing when you look at how websites have changed, the use of textures, photographic backgrounds etc has really changed how websites are viewed. You’re no longer looking at information on a web page, the web page is an environment made to look like something real that you can interact with.

    I love Bulls Boars n Barra!

  8. User GravatarRahul Jadhav 9th July 2009

    Thats some awesome collection. Loved it

  9. User GravatarTom 9th July 2009

    Adam: Yeah I totally agree with you. It makes you think – how are websites/designs going to evolve in the future. I’m willing to bet that they’ll become increasingly immersive. Todays designs are far more immersive than those of the 90s.

  10. User GravatarBrady J. Frey 9th July 2009

    Thanks for adding my http://bentlyreserve.com – it’s a fun design that’ll expand even more throughout the year with event photos:)

  11. User GravatarTom 9th July 2009

    No problem Brady! It’s a really great design, I look forward to seeing the expansions :) .

  12. Sam 19th August 2009

    The list has great designs, but i think it´s a shame publicating and supporting sites like: http://bullsboarsnbarra.com.au/
    athought it has an acceptable design it estimulates violence against some kind of animals. I don´t thing this is good for the PSDFAN image.

Leave a Comment: