Welcome to Arif Khan's blog where he writes about everything digital, creativity, education and some personal notes. More →

September 24, 2012

The New Responsive Maktion - simple, clean, inspired by Windows 8 metro style

Posted by

Windows 8 Metro | Source: 4sysops
If you've been following maktion closely then you would have noticed that I was away for quiet some time and couldn't blog much. It's not that I forgot about it, in fact I can never forget my blog maktion as it's a part of my identity now. Some people know that I blog at maktion, while some know that maktion is me. Either ways, it's a good feeling as maktion in my baby and like any parent (better than being called the owner), I would like to see it grow and add value to you - the wonderful readers. Yesterday was a special day as it was my Ammi's birthday and I chose to change the look and feel of my blog - maktion in her honor. This one's for her!

Okay, what are the ways by which a website or a blog can add value to you? What kind of website do you like? Some place with multiple ad units, cluttered information, overflowing social sharing buttons? Right now, I can think of Yahoo and feel Times of India is also catching up fast in this league. Or, would you like to see some website which is clean, have an intuitive interface and is self-explanatory, like Google for search and twitter for social networks? I'm sure you'll choose the latter. We all love simple things in our lives and translate that experience into the digital landscape - we like simple, clean websites which focus on good content. Such websites will eventually shine in the long run and have a respectable share of visitors traffic coming from organic search (primarily, google). I've been reading a lot on the future of the web and understood that in the coming years, the font style and size of the website will matter a lot. There was a Design expert who questioned that why do we have small fonts and force users to shrink their eyeballs into the white screen? Why can't we have easy big fonts so one can read in comfort? I kind of liked the argument and that's one of the main reasons you see the new website design right now! Bigger fonts. Like anything, it may catch up or go away into junk, but for now I've adopted this idea and am a part of the experiment of those category of folks who want to make the web a better place and provide you a better, pleasing experience. So, I will focus on writing more stuff which will add value to you in some way or the other through good content and the new fonts style may help achieve this cause. Well, I hope so.

Windows 8 Metro Style Sidebar
Till now, I've visited more than a thousand websites, both for personal and professional use and observations. Apart from the core utility of the website, I look for patterns and scribble a line or two on a post-it or cluster them in my mind to make something better and meaningful in order to create the right impact. This habit of mine's has helped me a lot in my college days, then my first job and now in Digital Marketing. I believe that if done well, then visual stimulation can leave a long lasting impact. Remember the last time you went to a mall and saw some stunning huge ad? Something that grasped your attention and you wished there was some association? Something which made you either buy it, or admire the style, or simply take a snap in front of it to quickly upload on facebook? That's visual power and the after-effects only come when it's studied in detail, observed well and implemented effectively. Likewise, the second important element of a good website is it's basic design. Ever since Microsoft Windows 8 came out and showcased their Metro Style Apps for the desktop version, I became a huge fan. These are nothing but square shaped intuitive apps which function like a jigsaw and visually appealing. I just love it for its neatness. Although there are reports that Windows has now dropped the idea of Metro Style Apps, I took inspiration from it to create the sidebar that you see on the right to hold the 'Featured Posts'. I think instead of putting 20 links and confusing the reader, I can selectively display 5 featured links through a simple metro style manner. And the early responses that have come in have been positive. Here's a short and sweet conversation between me & Windows 8:

I had tweeted on September 22 when I was in the process of conceptualizing the Metro Style sidebar for the new design:


Today, on September 24, Windows replied to my tweet (I always tell they listen!):


And it was fun to see to some gentleman add on top of that! haha


Along with a focus on content and design, I also scanned through at least 300 blogger templates to arrive at this responsive template which basically means that it can adapt to any screen, whether you're viewing on a desktop, on your smartphone, or on your tablet/iPad. It auto-resizes to ensure the website feel is rich and intact. Responsive websites are definitely the future of web. I don't know which blog has tried this all this packed in one, but for now I'm enjoying this new responsive design with a simple, clean look inspired by Windows 8 Metro look! It's only when you readers give me feedback that I feel the effort was worth. One of the regulars at maktion, Mr. Sumit Chakraborty had once tweeted the following feedback which pretty much sums up my intention of spending time and effort on maktion. In the end, it should add value to you.


I hope you like this post which narrates the how and why of the new design and would love to hear your feedback in the comment section below.

Till next time,
Ideate, experiment, implement,
A.



About the Author:
Arif Khan is a Digital Marketing pro who blends creativity, analytics and social media to create digital experiences and achieve marketing effectiveness. He blogs on everything digital, creativity, education and personal notes. In his spare time, he likes interacting with students and likes to cook. More →
You can connect with Arif on: Twitter | LinkedIn | Google+

Views on this blog are his own and do not reflect those of his employer.
Labels , , , , , , ,

1 comment:

Subscribe to: Post Comments (Atom)