Notice: Undefined index: order_next_posts in /nas/content/live/gadgetmag/wp-content/plugins/smart-scroll-posts/smart-scroll-posts.php on line 194

Notice: Undefined index: post_link_target in /nas/content/live/gadgetmag/wp-content/plugins/smart-scroll-posts/smart-scroll-posts.php on line 195

Notice: Undefined index: posts_featured_size in /nas/content/live/gadgetmag/wp-content/plugins/smart-scroll-posts/smart-scroll-posts.php on line 196

Studio Indoor: marrying flat design and page effects with HTML5 and CSS3

When it comes to interior design for your browser, this classy showcase website sticks to trusted standards to deliver ‘Polish’ aplenty

Designing to satisfy the design conscious can be delicate. On one hand you could reach those most appreciative of what you do, or risk more discerning criticism. This was the challenge for Polish web-slinger Karol Podlesny when crafting this presence for new interior design firm Studio Indoor. The multi-disciplinary marketing graduate from Gdansk University of Technology has utilised HTML5, CSS3, JavaScript and brochure photography to marry a flat, refined style with subtle page effects.

“The general look represents the open-minded attitude of the client, who loves experimenting with interior design,” Karol explains. “The first section was inspired by a kinetic slider of a Lexus website, plus I noticed a skeuomorphic-style camera icon somewhere on Dribbble and wondered how I could elaborate on it. So I produced a set of animated flat icons that enhance the experience.”

These aspects all help to add some life to the template when combined with parallax scrolling effects, multiple backgrounds, responsive tables and stylish tooltips – realised with core standards. “Used responsibly they make the internet a better place and that is why I love them. Now web designers are able to craft more interactive and mobile-friendly websites. My favourite tool though, is the text editor Sublime Text. I prefer designing in the browsers, rather than Photoshop. Most of the animations are made by combining CSS3 and JavaScript, plus well-known scripts such as Stellar.js and Swipebox.”