Social, Mobile & Brand Awareness…All in Less Than 45 Days

Big brand websites have been learning how to leverage social tools and consumer commentary to their benefit.  Adding a mobile optimized app on top of this social toolset is a natural next step to fully closing the loop on the consumer experience.  Recently, I was asked to be on a panel to discuss ‘real world’ CMS platform best practices for B2C sites requiring social content and mobile optimization.  Not too long ago r2i created the “Why Electric” campaign site www.RechargeYourYard.com for Black & Decker (B&D); this was a great example to showcase a mobile optimized app based on content types sourced by a community portal and the logic that went into creating a great user experience.

Black & Decker’s Highly Customized Mobile App

R2i created a highly social Black & Decker site, specifically branded “Recharge Your Yard,” which aggregates conversations about electric outdoor tools happening in real time, promotes widespread interactive features, and makes use of a range of user-generated content.

As a large brand, r2i recognized the B&D app needed to be scalable and assessable from an end-user experience, and the best way to do this in a high-value manner is through an web mobile optimized app. The app was designed to leverage the web site and content management system (CMS) including social media, conversation and user generated content while creating a mobile user experience tailored for all smartphone and tablet devices.

The site, built using an open source CMS, had many community portal content types such as Twitter & Facebook, videos, ratings, surveys, videos, discussions, detailed product specifications and a store locator map. Calls to action were created to engage the users deciding what products to purchase and to encourage switching from gas powered to electric powered equipment.  This includes the “Should You Go Electric” wizard, which helps the consumer determine whether or not they would benefit from their outdoor tool. Widgets were also created that presented a real time Twitter conversation stream with integrated geographic tagging displayed on a Google map. R2i also created a B&D story submission section to showcase specific user experiences with the products.

View the B&D case study here.

Mobile Optimized Design & Development Best Practices

When developing a mobile optimized app there are a number of design and development best practices organizations should follow. First, design for the optimal mobile experience (UI/Design/Functionality) then, content decisions will fall easily into place. Here are a few key details to remember:

• Create re-usable business logic and data layer methods

• Use mobi/m.dot – with automated redirection

• Don’t just re-purposed your website- it needs to feel personalized & interactive, be populated with high value content, render quickly and have analytics/behavior tracking in place / SEO.

• Coordinate Your Resources- U/I Designer (for usability), developer/QA (for functionality), information Manager for content)

Template Considerations:

• Keep file size small – Consider the end-user’s bandwidth and data rates

• Keep server requests to a minimum – Keep files to a minimum: combine CSS files for skin, combine images into sprites, and combine JavaScript (JS) files

• Resist heavy script usage – Utilize CSS 3 transitions and animations for a smoother look

• Use a server side detection and redirection – This approach keeps device from loading the desktop version until it hits a JavaScript or meta redirection

Business Considerations:

• Information Architecture & Content  – Filtered to what is most needed

• Functionality First – keep the end-user experience in mind at all times; K.I.S.S. (Keep It Simple Silly)

• Differentiate – if the market is crowded with identical concepts, do something different

• But Learn from Others – check out similar/competitors apps, use what features and design elements works, change what doesn’t

• UI Design is Critical – clear and accessible to all potential users; screen size, resolution, “touch-ability” are critical; test wireframes and mock-ups with potential users

• Don’t Forget the Icon – your app and brand needs to stand out in both graphic and name

R2i understands that a mobile app is an extension of your brand, a platform connecting your target audience through a seamless online experience. We help with the vision, creation, and tracking of your mobile apps to achieve your marketing goals and functional objectives. Working together, r2i can help you leverage your brand by providing cross platform mobile apps. Learn more about Black & Decker’s “Recharge Your Yard” today or contact us at info@r2integrated.com for more information.