A blog by the Brick Factory The Brick Factory
wearable_technology (1)

Wearable Is the New Black: What Wearable Design means for Your Website

If you’ve visited a tech blog or even skimmed through your Twitter timeline recently, you probably know that wearable technology, like the Apple Watch or Google Glass, is making a huge splash in the tech industry.

You may be wondering how you could ever use a website the size of a postage stamp on a wearable. Well, research from Cisco says it’s possible. According to their discoveries, 9.1 percent of web traffic will derive from wearables by 2019.

Which raises the question: now that we’ve gotten the hang of designing responsive sites for tablets and mobile phones, how do we begin to implement responsive design for wearables? As a comparison, below are some examples of some of our clients’ our responsive sites, compared with the screen size for one of the Apple Watch models.

 

responsive3 responsive4 
 

While you may be unsure of the specifics (or even what exactly it is), you’ve likely experienced a tangible difference when navigating a responsive site.

Responsive design ensures that a website displays and performs well, whether on a phone, a desktop computer, or a tablet. A website with responsive design gives users access to web content on their phones or tablets without the clutter and excessive load times of a website only designed for desktop computers.

Because of their app-like features, responsive sites are faster and more user-friendly, making it easier for visitors to access information on the go.

This positive user experience goes a long way: users who visit responsive sites are more likely to develop long-lasting relationships with companies because of their attention to detail and consumer needs. This often translates into support and donations, as we’ve seen with many of our clients. It’s safe to say that responsive web design has become a new standard for web development.

What Responsive Means for Wearables

Because of the limited screen size, wearable technology takes responsive design to an entirely new frontier. But, at least for now, many wearable retailers like Apple are avoiding the issue of responsiveness by restricting web browser use.

Expect this to change. If wearables hope to become the new standard, retailers won’t be able to limit browser use for long. Access to information on the web is too important to consumers to ignore.

Without even marginal access to the web and online content, wearables stand no chance of changing the ways in which we value and prioritize technologies: the Apple Watch will be the next Google Glass, with the potential to change the industry, but none of the practicality to actually live up to it. This likely means that, in the coming years, websites will need to be optimized for computers, tablets, phones, and wearables.

The size of wearables presents as many new challenges for consumers as it does developers. For developers, the challenge will lie in prioritizing the content featured on wearables and coming up with user-friendly interfaces. For consumers, the challenge lies in productivity. My advice for consumers: wait out the gold rush until design trends establish a status quo. As for developers, now is the time to take advantage of this new creative challenge to design for the future and implement your wearable web design.

What Developers Can Expect for Wearable Web Design

Designing for new devices can be a challenging proposition; here are some things for developers to keep in mind when beginning the journey.

  • Cross-app optimization: Wearables are optimized for cross-app functionality, meaning users will likely be prompted to add articles and blog posts to reading lists for future viewing on other devices, rather than attempting to read them from tiny screens.
  • Capacity at the forefront: It’s crucial that web designers and application developers alike consider the limitations of hardware for first-generation wearables. Regardless of how beautiful a site may be, users will be less likely to interact if it means tethering themselves to a charging cord shortly thereafter.
  • Even less clutter: Check out an example of a potential site design for the Apple Watch. This serves as a great example for a way in which companies can maximize their screen real estate while still engaging users from the jump.

redlistwearablefinal

The Magic Is In the Makeup

In the world of website and graphic design, image is everything, and with it, the art accompanying the project just as significant. While businesses frequently face the challenge of finding images that appropriately represent their organizations and/or services, it is not to say that success will be found 100% of the time. Surprisingly, the most important aspect of their presentation can often times appear rushed, or other times under cooked.

The entire concept of image retouching is similar to that of a magician: The viewer should never be in on the trick.

Image manipulation is truly an art, and nowadays when a 15 year-old can remove a lingering pimple before posting party pics to Facebook, everyone is in on the act, albeit with mixed results.

I am always on the search for examples of what I’d like to call "photostopping,” where both the photo and reality end, leaving you wondering why an effort was made at all.

I find myself endlessly entertained by the website Photoshop Disasters, featuring examples of poorly implemented designs that actually make it past the cutting room floor. Viewing the site, you would be surprised at the epidemic of models missing limbs in advertisements.

microsoft-capture-FINAL

This example comes from the Polish edition of the Microsoft website. While it is not uncommon to come across websites using the same stock images, it would seem that there are only so many of the standard “diversity” business shots available.

In the image, one businessman is clumsily swapped for another, going as far as neglecting the color of the replaced man’s hand. While you could potentially excuse other companies for shoddy design, please remember— this is MICROSOFT!

And I haven’t even touched the subject of the obvious white MacBook prominently featured in the center of the shot.

Source: Photoshop Disasters

Further reading: Joe Wertz: The Politics of Photoshop — 10 Historic Doctored Photos

Tech Meets Cycling

I ride my bicycle to work whenever possible through the scenic District of Columbia, which offers me numerous benefits. It forces me to exercise regularly, cuts down on commuting costs, is a zero emissions method of navigating the city streets (aside from manufacturing processes), and it’s much quicker door-to-door than driving through rush hour traffic.

Naturally, I’ve dabbled with websites, apps, and mobile tools to enhance my riding experience, most of which have been of little or no use to me. That said, there are a few gems available to cycling enthusiasts, and I thought I’d highlight the best of the best from my experiences. Keep reading after the jump for my findings.

(more…)

2009: My Digital Resolution

The first Monday after the New Year brings many of us back to reality after a fleeting period of mental freedom (barring any drama with the in-laws, of course). This time of year many choose to reflect on the previous 52 weeks, and determine what kinds of lifestyle changes will make the next year (in our case, 2009) less lackluster. Instead of boring you with non-existent plans to visit the gym with increased frequency, or a false promise to cook at home more, I've decided to share my list of ways I would like — and have already begun — to change my internet habits.

Online Products Getting the Axe

  • Flickr. With more and more of my friends making use of Facebook's photo albums, I have been using Flickr less and less. While I realize there's still a place for the artsy photostream, Flickr, once a mainstay of my daily online repertoire, is largely absent from my browser's address bar.
  • Firefox. Nothing personal to Mozilla, and I still run it on my Ubuntu and FreeBSD boxes. But when it comes to my business-centered Windows machine, I have abandoned this once-touted browser champion for Google Chrome. Now out of beta, the UI is slick and it uses far less system resources than the now pudgy Firefox. Disclaimer: I am also a self-proclaimed Google fanboy.
  • Technorati. I still view Technorati via RSS, as their headlines are worth a look. However, I used to use this service mainly as a blog search tool, and Google Blog search has simply surpassed it.
  • Twitter. After Facebook implemented and revamped its status updates, Twitter doesn't quite have the same sheen it once had. In addition, most aggregate services implement with the Twitter platform if you really need to stay afloat on any crucial Tweets. Not to mention its non-impressive growth over the last few months.

Online Products I Use More, or Have Begun Using

Excluding the mainstays such as Gmail and Facebook, here are some products I've made some room for as we transition into 2009.

  • Google Reader. While I did not begin using this recently, the revamp of its design and new features have really set this reader further away from the pack than I had imagined.
  • FriendFeed. Upon launch, I was adamently opposed to FriendFeed. After some time to work out kinks and to catch on in popularity (and by nature, functionality), I have found some good news leads and websites through this service. I joined FriendFeed to show how pointless it was, and now it saves me time by aggregating all sorts of websites I'd rather not visit primarily.
  • Hulu. I only really watch It's Always Sunny in Philadelphia, and it's available on Hulu. As are all of the archived episodes of Arrested Development. I watch more Hulu than television by a long shot. Where else can I stream forgotten films of the 80's and 90's for free with (very) limited commercial interruption in 480p?
  • Truphone. I make a few calls internationally every now and then, and while Skype is great, without a truly mobile Skype phone available in the United States this service is truly discount calling on the go.

I'm excited to see the innovation that will come with 2009, and hopefully this list will expand itself with better offerings as the year progresses. What kinds of digital changes do you plan to make in the New Year?

Website Review: Updated Metro Page

There are several websites that I frequent at least once a week for entertainment value (thank you, Zero Punctuation), but there are also several sites that I visit purely for information on a once-a-week-or-more basis.  Because I live in DC, one of those sites is definitely the official Metro page.

The website began in 1996, and according to the site, receives over 16 million page views a month.  Users can use the site to plan their public transportation trips, read up on emergency alerts, and find out about discount programs and payment plans.  Yet, as useful as it was, the site was in need of a major overhaul.  Thankfully, as of December 8, my lamentations were heard, and I'm happy to say that I am quite pleased with the result.  My favorite parts of the updated site, as well as some screenshots, are after the jump. (more…)