Mobile is dramatically changing consumer behavior. Today the concept of ‘wasted’ time is increasingly being replaced with the notion of ‘found time,’ due to the proliferation of smartphone use. Hours that previously slipped away while waiting in line, are being reclaimed and becoming increasingly productive. Consumers are catching up with email, reading articles, browsing for products and even making purchases; in fact, almost “38% of our daily media interactions occur on a smartphone. There is a great upside for businesses to this changing consumer behavior–but like all changes it comes with a catch—companies must deliver sites that are very mobile-friendly.
Having a mobile-friendly site is the first step in developing a mobile strategy and although most companies recognize they need to employ one, many are tentative about the best approach. There is much debate about the best solution—most often between an m dot site (m-site ) or a customized app, or perhaps both? Although it is easy to focus on the technology platform, technology isn’t the right staring point. Organizations need to focus inward and look at their core business to determine what the best experience would be for their customers.
Mobile is a key consumer touch point and it shouldn’t be treated in a silo or an ‘offering.’ To deliver the best in class mobile experience and one that fits with your organization’s goals, the online interface needs to be flexible, fast and optimized. It will also need to be as equally proactive as it is responsive. For example, organizations that actively email customers special offers must be prepared to have these customers open and interact on their site with a smartphone or tablet.
Organizations that are courting savvy consumers using smartphones and tablets must deliver websites that are equally as smart—sites with intuitive navigation, the right font sizes and automatically adjusted visuals. Forward thinking companies recognize mobile is here to stay and they want to deliver a scalable and maybe even future proof site. Companies that are looking beyond the technology and are focusing on the user and the mobile ‘mind shift’ are increasingly adopting responsive web site design because of its ability to deliver a best-in-class user experience.
Responsive web design (RWD) hits it out of the park because it is device agnostic—it works equally well on a desktop, tablet or smartphone. Everything happens ‘behind the scenes’ so sites are adaptive and the consumer doesn’t have to download an application or select a mobile site. There is no need to search for the ‘desktop version of the site’ because with responsive web design there is only one version of a company’s website with all of the content and features included.
With thousands of screens in marketplace, all with different dimensions and resolutions there is a clear advantage to having one site that can be optimized for both multi-screen viewing and mobile users. With responsive web design consumers are delivered the deep content and functionality they have come to expect from a desktop version plus all of the ‘extras’ consumers rely on from a mobile site such as location information, mapping, click-to-call (dialing), and speedy site loads.
From an organization’s point of view, responsive web design delivers a mobile solution and a multi-screen solution. It works equally well on a smartphone, tablet or desktop because the design is flexible and it is able to deliver the most advantageous experience to the user, ‘customized’ to the device being used. “Media queries” determine what resolution of device it needs to be served on and the responsive design automatically renders flexible images and fluid grids to correctly size content to fit the screen. It’s beauty in the online world—a site needs only to be built once and it works seamlessly across hundreds of different screens.
Users enjoy the responsive design because it effortlessly delivers content—the bigger the screen the more the user sees—the smaller the screen the less there is in their visual field. You can try it out for yourself by visiting one of the RWD sites designed by us—TELUS’ Corporate Social Responsibility or Machine-to-Machine. Notice the difference on your desktop/laptop, smartphone or tablet and watch how the layout seamlessly shrinks from three columns, to two columns, to a singular column of content to match the device it is used on.
From sharing content, getting directions, to registration or purchases; if it can be done on a website via a desktop, the consumer wants the convenience and ease of doing it on their mobile. With responsive web design it is possible because optimizing for mobile isn’t an offshoot—there is no replication of design, duplication of SEO or doubling up on analytics on two sites, instead it re-engineers your core site to be the best of the best on a smartphone, tablet or desktop.
Some additional benefits delivered by responsive web design are:
- One site for all needs—literally “leaving no device behind”
- One site to update, manage, monitor and optimize (which is cost-efficient)
- SEO benefits –ranks higher because the site is optimized for mobile and desktop and anything in between
- It is endorsed by Google as an industry best practice
- The design is fantastic for content, content and yes more content as it lends itself extremely well to being searched, referenced and shared
Responsive web design is the superlative, but quality comes with some caveats. In general a RWD is customized, complex, and it has extra layers involved in development so it may take a bit more time to do it right. However, the long-term cost benefit ratio of managing one site and optimizing the customer experience often outweighs the initial investment.
While a custom responsive web design may be what your organization desires there may be time or budget constraints that put it out of reach or perhaps the customer experience that you are delivering is better served by an m-site or app.
Going ‘mobile’ or ‘multi-screen’ is a journey and not a destination. It won’t happen overnight but organizations wanting to capitalize on the mobile experience should start with the basics and build on them. Delivering an optimized mobile site means “better experiences which mean more conversions, more engagement and a better chance the user will walk away with a positive feeling about your brand, service or product.”
Seize the opportunity to connect more closely with your customers by mastering mobile. We’ll continue our review of how companies can optimize website interfaces with a review of m-sites, apps and performance based web design. If you don’t know where to start this might be the right time to invest in some market expertise to help point you in the right direction.
Photo credit: Johan Larsson
Today we performed a presentation around responsive website design to 160 TELUS Enterprise Team Members and thought it would be useful for you to highlight the key points from the presentation.
- What is Responsive Website Design?
Responsive website design is the layout and the use of fluid grids, flexible images & media queries in order to optimize web experiences for consumers regardless of device they are using (desktops, laptops, tablets and mobile devices).
- Why Use Responsive Design?
There are a number of reasons. Some reports indicate a majority of users that have a bad mobile experience are less likely to engage with a company. Many websites report that somewhere between 20% and 25% of total traffic come from mobile devices. Responsive website design is also easier to manage when updating your website.
Oh yes – and because Google says it is important for improving organic search engine rankings through mobile devices. In fact, in the near future, Google will not show any Adwords ads on mobile devices for websites that do not have a website optimized for mobile.
- How to Approach Responsive Design
Here are the tips we provided for companies thinking about optimizing their website through responsive design initiatives:
- Focus on emphasizing key content that users search for when using mobile devices
- Use metrics to determine how content is being consumed on mobile devices
- Have all your content ready before engaging in responsive design
Try it out for yourself. Visit one of those websites on your desktop/laptop and smartphone and notice the differences. You can even resize the browser window on your desktop/laptop and watch how content moves around.
Please contact us at (604) 484-0606 – ext 109, if you are interested in having our team present the benefits of using a Responsive Web Design approach to mobile to your organization.
We are thrilled to announce that TEDxVancouver selected POWERSHiFTER as a digital partner to transform their site into a multi-screen video delivery machine, through the use of Responsive Web Design (RWD). Each visitor’s device, regardless of screen size, will be serve up a TEDxVancouver experience tailor made for the device the site is being viewed on. This will ensure that the great TEDxVancouver talk videos will be accessible to anyone, anywhere and essentially future proofing the content from the fragmented screens sizes of today and tomorrow.
We are proud to be the Digital parters for TEDxVancouver, and are looking forward to working with their great team in delivering a digital experience worthy of such a well loved brand.
We were honoured to partner with Creative Mornings Vancouver this month to kick off the new year with the theme of “Happiness”. There are many ways to approach a theme and celebrated origami artist Joseph Wu chose to approach it from a “journey in progress” that has not yet been reached. Joseph was diagnosed with ADHD as an adult after his son was diagnosed with it. He says it was tough to discover this fact and that the it was the catalyst for a two year depression of which he is just emerging. Joseph’s journey is like so many other creative people that I know and his talk shines a bright light on what having ADHD and being creative can be like.
We have included the entire video below for your viewing enjoyment. If you want to know more about the Creative Mornings organization, then make your way over to thier site and see how the other 42 chapters embraced the topic of Happiness.
We spent the day at the Orpheum taking part in TEDxVancouver – tedxvancouver.com. If you didn’t know that TED was in Vancouver this weekend, TEDxVancouver, a non-profit, independently organized talk, brought 2,300 [Worlds largest to date] participants and 11 local speakers to share ideas and spark discussion.
POWERSHiFTER joined the sponsor family for this one day event – it makes sense for us to take part in in a day where people are encouraged to dialogue and think differently. Today, speakers shared wisdom on everything from justice to travel to the sociology of gossip.
As part of the sponsorship, POWERSHiFTER was invited to provide attendees with “swag that was useful.” We gave these cool refillable, BPA free water bottles to attendees. Thanks so much to the folks at TEDxVancouver for allowing POWERSHiFTER to sponsor today’s thought leaders and help us quench more than just thirsty ears with our water bottles.
TEDxVancouver did an awesome job, we had a great day and left inspired. Can’t ask for more than that on a rainy Sunday. Just wondering when the next one is so we can get tickets.
For digital marketing agency POWERSHiFTER, it pays off being lean and mean. For the first time the Vancouver agency was named to the Business in Vancouver‘s Biggest Graphic Design Firms in B.C. list.
POWERSHiFTER is 25th on the list. “They changed the way agencies are measured this year,” said Creative Director and Founder JP Holecka. “Instead of the number of employees, they’ve measured gross billings.” POWERSHiFTER currently has just four full time and 4 part time employees but earnings approaching seven figures. The agency expanded from five employees in 2011. “We are sustaining 50 per cent year over year growth and already on track to pass our targets this year,” said JP Holecka, who founded the agency in 2001. “We are lean and mean but we can still play with the big guys.”
Version 1.0 of our site over stayed it’s welcome longer than I ever thought possible. We have been working on our 2.0 site since late last year. In fact we just celebrated the wireframes 1st birthday. Kidding aside, the reason for the delay is because we have been busy with exciting new client work. Most of our new work never even made the pages of the 1.0 version of the site’s portfolio page because, we thought 2.0 completion was just around the corner.
The directive to our sr. developer was to make it pixel perfect, something he does every time anyway, and make the backend so easy to update that we could task either our parents or an intern to do it. I am happy to announce that he did both. Not only did he nail the visual handed to him by the art director, he also customized the CMS so that 95% of the site could be updated without a single line of code being manually altered. The reason for the direction was two fold, firstly this is what we would deliver to our clients, and secondly so many digital agency sites are poorly cobbled together quickly between client projects and it’s too hard for anyone other than the busy agency developer to update.
We are extremely proud of our new site and know that it better reflects who were are as an agency. Please explore the site and feel free to let us know what you think in the comments below.
We have physically moved offices to our new building on the edge of Gastown. Some claim it to actually be Gastown but that is not correct, Gastown is further to the north. Our new office is in the historic Dominion Building that was at one time the tallest building in the Commonwealth. I was reluctant to head back over to this side of town after spending many years at other agencies here, but I have to admit it’s finally changing for the better. We have great places to eat and hairy hipsters that serve up coffee just the way I like it, strong and with plenty of attitude. I mentioned that we are physically in our new digs but not fully moved in yet as our order of furniture is not arriving until April 20th. So it’s cardboard boxes and milk crates for a little while longer I am afraid. We should be fully moved in by the end of the month and may even have a little open house to celebrate the expansion.
Please take note of our new address: 310-207 West Hastings Street Vancouver.
Photo: rommy ghaly
In the late spring of this year TELUS came to us with the request to completely revamp their Community website. The existing site was hard to navigate and important information about TELUS community involvement, programs and donations were not being showcased well at all. Not that it was the fault of the site’s design per say, but rather the business objectives and content had changed substantially since the last major overhaul. TELUS is much more active in the community and funds hundreds of community programs across Canada as well as emergency relief in places like Haiti and Pakistan. In fact they were named Most Outstanding Philanthropic Corporationglobally this year. With that kind of commitment to giving they needed a site to both showcase the programs but to also give charities easier access to applying for the funding. Our goal was to achieve both objectives while updating the branding that the site had not kept pace with.
Our team completely re-wired the information architecture into four main sections. 1) Philosophy, 2) Community Investment, 3) Team TELUS Cares, and 4)Funding Application form. Prior to our design, new sections would get “bolted on” in odd locations because the site’s architecture was not designed to capture the community program holistically. With the four new global sections we knew that all current and future content would be able to find a logical home in the site that was not be a force fit.
One of the key problems of the existing site was that there were all of these great programs being funded by TELUS that was not being percolated to the top or home page for users to see….well there was no real home page in the last design to begin with to be honest. The new homepage now has a large current events carousel that showcases big projects and initiatives very clearly and in the well known TELUS brand of large images, short headlines and summary copy. The cool part of the carousel is the hidden funding map that is just behind the large revolving slides. When you click the Funding Map button an interactive Google map is takes center stage on the homepage and a showcase of TELUS community projects from coast to coast is revealed. Users can quickly browse the projects and then click into the bigger story right from the map. Site users no longer have to root through many levels to dig into the funding showcases.
The four sections of the new site are now more logical and will always be able to absorb new content organically. There were two main areas that were not showcasing the way TELUS funds programs. Both the Community Boards and TELUS Ambassadors were not only buried but were just giant dumps of heavy copy that users would have to wade through. Each Community Board and local Ambassadors group were given there own landing and project pages. Now each team could showcase the project with text and images. There was substantial weight added to presence that they had on the site. Both of these groups really are on the front lines when it comes to actively working with either local community funding or in the case of the TELUS Ambassadors working directly as volunteers.
The other main goal for the new site design was to give community groups and charities easier access to TELUS funding for projects. A new prominent global driver was added to the site so that no matter where the site user was they always had a quick way to apply for funding. We also changed the funding pages to be a stepped process so that applicants would have to walk through a gated pre-application area. This was done to reduce the error rate in funding applications. The old site design let applicants jump right to the application form bypassing the funding guidelines resulting in a large number of errors in the application process. The new design looks to reduce this substantially.
The biggest challenge for us with the Community site as the fact that it was not on a content management system and all 400+ pages [ 200+ English and 200+ French] needed to be delivered in flat html….we utilized a Ruby on Rails compiler and some markdown to make the process a little easier, non the less it was quite the Herculaneum effort for the dev team.
This is not a dump and run exercise either for the site. Our team is moving right into phase II and ongoing site updates. We are assisting TELUS in a content program that will help them manage all of the stakeholders to provide timely and important updates to the site, so that it will continue to grow and showcase the latest ways in which TELUS “Gives where it Lives”