Why and How to Build a Mobile First Web Strategy

Editor's Notes

• #4 consumer side vs. operational side – customer experience vs. backend? how mobile is affecting operations-it’s impacting the entire business – BYOD stats, operational efficiency operations, retail Introduction: There are over 1.2 billion mobile web users worldwide (2014 Mobithinking Report) 60% of consumers use mobile exclusively to make purchase decisions (2014 Mobile Path-to-Purchase Report) In 2014 10.6 billion online visits via smartphone vs. 5.8 billion on PC (2014 Mobile Path-to-Purchase Report) More than 40% of consumers cited mobile as the most important media source for information (2014 Mobile Path-to-Purchase Report) Talk about how consumer behaviour is changing, what’s the impact on business How big is the impact of mobile How business models are being threatened A Mobile First Strategy is competitive and agile Mobile as an operational strategy for businessConsumerization of IT is happening and analysts believe that this will open up a wide range of possibilities which will allow marketing and content targeting to be done at a more personal level than ever before. Now more than ever it’s important to cater to mobile users with fully optimized websites Mobile First: In the past designers have built websites focusing on the desktop user first and the mobile user was secondary. Based on mobile browsing growth, the recent trend has been to turn this process on it’s head. The term ‘mobile first’ refers to the approach in web design where the initial focus of a project is directed toward mobile usage – all decisions and thinking are made with only the mobile version of the website in mind. Mobile first is becoming the new mobile responsive as it allows for increased personalization and a richer user experience which we will talk about shortly.
• #6 slide-share, reduce content and add a graphic add graphic for presentation and put the bullet points in the notes Responsive website design is based around the idea of adjusting the website design process according to the viewport size of the device and media queries. A good viewport device would get additional styling and a website ramp up whereas the website would be dumbed down to minimal resolution for smaller devices. Mobile first web design is simply the extension of support to mobile devices with no change occurring in the design or resolution with device variance. Mobile first web design adopts a basic one for all approach regardless of device type. These designing strategies are not competitive, instead they complement each other and we will outline this later in the presentation.
• #7 slide-share, reduce content and add a graphic add graphic for presentation and put the bullet points in the notes Responsive website design is based around the idea of adjusting the website design process according to the viewport size of the device and media queries. A good viewport device would get additional styling and a website ramp up whereas the website would be dumbed down to minimal resolution for smaller devices. Mobile first web design is simply the extension of support to mobile devices with no change occurring in the design or resolution with device variance. Mobile first web design adopts a basic one for all approach regardless of device type. These designing strategies are not competitive, instead they complement each other and we will outline this later in the presentation.
• #8  Content First Design- it’s easier to fill a house than it is to move from one into an apartment. In the desktop there is a tendency to add functions, images and content just to fill space. This creates clutter when it is translated to mobile. In a mobile first environment there is simply no real-estate for clutter. Increased ROI- you typically spend less time and money on design and with the increase in personalized experiences for your users you will benefit from higher engagement and conversion Improved Site Navigation- in the mobile world less is more. Clear navigation and smaller menus will lead to increased user engagement and conversions. Drop downs can be removed as they tend to be problematic and do not translate well to mobile due to the lack of rollover function. Fills Performance Gaps- helps to address and solve main issues of mobile responsive designs including navigation, content hierarchy, ease-of use and loss of critical functions. Strategic capabilities - Omnichannel Customer Experience- Many retail stores are currently working on providing customers with applications that gives them the exact layout of the store and allow people to make searches about the products they are looking for. Sales people can be added and this will provide a comfortable experience to the user. This is not only restricted to retail and can translate to other service providing firms. Enhanced Customer Segmentation- Mobile devices have a whole slew of new capabilities that don’t exist on personal computers. Smartphones can pinpoint you down to 10m with GPS, down to 50m with Wi-Fi. They know the direction you’re facing, the direction you’re moving, how fast your device is moving, the position it’s in – the list goes on. And if you start thinking about mobile first you can take full advantage of these capabilities.” Empowered Customers- While you are paving a new path for customers, you can also help them make better buying decisions by providing them quality information about the products. Your customer can make searches about the product and your application will provide them with authentic reviews and if the product doesn’t exist in your inventory, it can provide with better alternatives. Talk about social integration here as well.
• #9 Functionality Expectations: users expect functionality on mobile to be equal to or supersede the desktop version. They overlook the technical inhibitions that mobile devices put up such as lack of plugin support. In order to deal with this situation, most enterprises develop a two way approach. A mobile website is developed that can cater to primitive devices and an application is designed which can provide additional functions and ease-of-use. Constraints of Starting Small: less room to work with, reducing content can be challenging. Balancing Act: designers need to find a happy medium between offering the users what they need and want, but not excluding larger and more powerful devices and their users, who could potentially feel disappointed and underwhelmed by the stripped back, bare-bones design approach and potential lack of functionality or wow factor. Potential design/development setbacks: The downside to this approach is that it is heavily reliant on trust from the client, craft & spontaneity from the design agency, and frequent open communication between both parties — okay, not necessarily a downside but potentially a difficult combination. Maintenance/Cost: multiple URLs or redirects, additional SEO work, maintaining two different sites separately. Not always universally compatible: You have to consider that there are two different types of mobile devices. A single mobile website won’t look and work the same way across all device types.
• #10 Main Considerations: Mobile lacks the capability to seamlessly support content unlike desktop browsers A mobile first design requires a reduction in features while at the same time maintaining functionality Users with the simplest setups Functionality across multiple platforms One of the following methodologies should be adopted: Graceful Degradation: stripping/simplifying the desktop design to remove various elements so it can fully cater to mobile devices that have decreased functionality Progressive Enhancement: this approach on the other hand is the idea of gradually enhancing the simple mobile based website to suit devices that have advanced capabilities such as support for additional third party plug-ins, better processing power or storage options. This methodology is adopted when a company starts off with a mobile first approach or when a simple mobile-based website or application is improvised and enhanced to accommodate high-end mobile devices or even desktops.
• #11 Calculate the benefits for both your business and your users from a mobile first approach. Ask yourself: How will the mobile experience be better or different from the desktop? What specific tasks do you want your user to be able to accomplish through your mobile strategy? Would it be faster to achieve the desired results from a smartphone? It’s not just about mobility, it’s about carrying out tasks much faster than a desktop.
• #12 Choose the Right Vehicle - Mobile Apps vs. Mobile Site: What do you aim to deliver to your target audience? This will influence your decision and your marketing. Ask yourself: Do you wish to deliver content? Website is best. Do you wish to deliver functionality or tools to your end user? Application works best here. Will you have a need to integrate social and if so how will you do this?
• #15 We can build small prototypes, applications or application portfolios