AND not OR*: How Mobile, Social and Web are converging

by Sonali Shetty of Hodges Digital Strategies

*For a refresher on Boolean algebra go here.

Are mobile, social and web three separate entities anymore? Not when you consider the following:

  • The number of smart-phone users, world-wide just crossed the 1 billion mark.  In the U.S., approximately 87 percent use their phones to access the web and other apps (25 percent of whom, primarily use their mobile devices to access the web).
  • More than half of Facebook’s 1 billion users access the platform through their mobile devices, while 18 percent of whom don’t even visit the website.

So, it’s no longer an option to pick a platform, businesses must be on all of them. At Hodges Digital Strategies, our most interesting challenges are design and development at these three intersections: mobile + web, mobile + social and web + social.

Mobile + Web

  • Side-by-side example of website on mobile (left) and mobile-optimized website (right)

    Mobile friendly sites (Sites that function on mobile devices.  These sites have no flash and small image sizes for relatively fast loading. Users may need to zoom in order to use the site.  Newer design and development capabilities are phasing out these kinds of sites in favor of mobile optimized and responsive sites.)

  • Mobile optimized sites (Sites designed to cater to mobile devices. Pared down functionality and navigation elements, large, touch friendly buttons and minimal data entry allow for mobile optimization.  Most mobile optimized sites give users the option to view the desktop version of their website.)
  • Responsive design (Sites that utilize responsive methodologies for web development. A full website that renders seamlessly on devices with various form-factors. Meaning, a separate mobile site is not required – a large three column site on your large screen monitor, with rich visuals and extensive menus, can step down to a single column in a series of steps, responding to various device sizes.)

As more people interact with the web, primarily through their mobile devices, mobile capabilities for your website are no longer optional. While there is no right answer on whether to choose mobile optimized or responsive, we are biased towards responsive design and are incorporating these techniques in pretty much every new site we build.

Mobile + Social

Of the main social platforms, Twitter and YouTube were the most mobile-centric from the beginning, however, the switch to Timeline impacted apps, as they’re not visible via Facebook’s mobile app. To mitigate this (and to aid in app discovery), Facebook announced App Center. Mobile friendly apps that are registered in App Center are now discoverable through Facebook’s search bar. From a development perspective, it does mean that each app needs to also include a mobile version (using any of the above methods). There is slightly more work on the backend, however, with more and more users coming in from mobile, this is the only way for the users to access apps on their devices.

Web + Social

Back in 2010, Facebook introduced Open Graph API (yes, that ubiquitous “Like” button is just a toddler). Social sharing by liking or sharing content on social platforms like Facebook, Twitter and Google +, has been deployed on millions of websites. Sharing also happens in the reverse direction by embedding activity streams from social media onto the web.  Single sign-on (signing up for a web-app via your Facebook or Twitter account) saves us from having to remember yet another user ID and password. However, balance that with the risk of allowing the 3rd party site access to your information and sometimes publish on your behalf. You can control third-party app access via privacy settings on your Facebook account.

This digital convergence is only going to accelerate further and include future platforms. Just think: Google Glass, the Nike+ FuelBand, your car’s dashboard…the fun has only just begun.

Our New Website: Being “Responsive”

Editor’s note:  Great job by Tony Scida and Casey Ferguson on our new website.  One of the features that’s explained below is “responsive design” which basically means the site grows and shrinks to accommodate the computer or mobile device that you’re using.  To best illustrate, view the site on your laptop and then your smart phone.  Or just look at the images below.  Cool, huh?  We think so.  Enjoy.-JN

by Tony Scida

When I started at Hodges, the first thing I wanted to do was update the website. While the site had served the agency well for a number of years, it had started to show its age—it didn’t take advantage of the new variety of screen sizes that users have come to find on their desks and in their hands, for instance. It was also not all that easy to update to add new Hodgers or update or add case studies, for instance.

I was cautious at first, because I wasn’t sure how Jon & Josh (and my coworkers) felt about the existing site and the prospect of undertaking a major site redesign. Fortunately for me, everyone around here was in agreement that we needed a new site.

This week—just days shy of my three-year anniversary—we’ve launched the new hodgespart.com. What took so long? Well, I’ll talk about some of the site features and considerations below, but the main reason is that, as with any agency, client work comes first.

Goals for the new THP site:

  • Update the look and feel to match recent logo and color palette changes.
  • Better integrate additional services and practices such as social media and luxury.
  • Improve updateability of the content.
  • Provide a first-class experience for users of mobile and other small-screen devices.
  • Put the work front and center.

With these goals in mind, we worked with Sonali and the Hodges Digital Strategies team to create the final site you see. Here are some of the features we’re particularly proud of.

Our website viewed on a browser

Responsive Web Design

The site was designed from the start to work well on iPhones and other mobile devices. Without getting too technical, the site uses modern CSS and HTML features such as media queries to resize and shift elements on the page to provide a better experience on small devices without sacrificing the desktop experience. We learned a lot of responsive design throughout this process, as we do with every project, and we already have some enhancements to the responsiveness planned.

Client Success Front and Center

Our website viewed on an iPhone

On the previous site, the case studies were a little minimized. They were all on the same page and there was no room for compelling images. With the new site, we decided to put the case studies right up front. And, thanks to our content management system (CMS), we can easily change and update the case studies that are featured on the homepage. But case studies aren’t the only way we’re featuring client work. Because this blog serves both THP and HDS, it didn’t make sense to create a separate blog on the THP site, so instead we created what we call The Gong, a nod to the real-life gong we hang in our office. When something good happens, like a great hit for a client, we bang the gong so everyone in the office can hear. With The Gong, which I like to call our “hit blog,” we can now sound a virtual gong as well.

What’s Next?

Just because this site is launched doesn’t mean it’s done. This was a long time coming, but it’s just the starting point. We’ll continue to update the content, optimize performance, refine the responsiveness and, we hope, constantly update The Gong with quality client hits.

%d bloggers like this: