{"id":4813,"date":"2013-06-06T14:29:35","date_gmt":"2013-06-06T21:29:35","guid":{"rendered":"http:\/\/www.noomii.com\/blog\/?p=4813"},"modified":"2013-07-29T14:31:17","modified_gmt":"2013-07-29T21:31:17","slug":"the-noomii-redesign-more-than-just-a-facelift","status":"publish","type":"post","link":"https:\/\/www.noomii.com\/blog\/?p=4813","title":{"rendered":"The Noomii Redesign: More Than Just a Facelift"},"content":{"rendered":"

Hello Noomii Coaches and Clients!<\/p>\n

This is Cole Brown, Noomii’s lead front-end developer, here to share and explain some of the exciting changes that hit Noomii over the Memorial Day weekend.<\/p>\n

As many of you are aware, Noomii has undergone a dramatic redesign to the site. While there are many visual changes to the site, the primary focus of our site redesign was to add responsive design features to the code. What does this mean for you? It means that Noomii has been optimized for the mobile age, with dynamic page resizing on mobile phones and tablets.<\/p>\n

Welcome to the New Us<\/h2>\n
\"DesktopOur new homepage<\/p>\n<\/div>\n

Before this redesign, using Noomii on a phone or tablet was a less-than-optimal experience, where nothing fit on the screen and tapping around resulted in more missed clicks than successful requests. One possible solution was to build a smartphone app. We soon realized, however, that clients who visit our site typically only visit a handful of times are not likely to download an app. Another option was to build a mobile-specific site–you know, the version of a site that you can access by pointing your browser to m.cnn.com, for example. But this solution creates a problem with redundant content, and that\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s bad for our pagerank and would, ultimately, cost us thousands of potential client visits. We had to keep looking.<\/p>\n

This final solution was unanimously agreed on after I pointed the Noomii staff to the beautifully redone Boston Globe website<\/a>. They were the first major business to implement a fully response website and, at the time, that was a huge risk–and a worthwhile risk. Responsive design is on the cutting edge of web development standards. Most web based businesses have not yet invested in the technology, because an overhaul of their existing systems would cost hundreds of thousands of dollars and countless hours of development time. Many features still need to be fine-tuned for various browsers, and bugs are bound to pop up in unexpected places. For Noomii, however, this option was not only the most elegant solution to the mobile market problem, it was also the most cost-effective solution, aimed at continual improvement of the system we use to unite coaches and clients.<\/p>\n

Once the solution was proposed, we strategically chose three important use cases for the redesign: mobile phones, tablets, and laptop\/desktop computers. These three different use cases present unique opportunities for Noomii, allowing us to more selectively show information to users depending on where they are browsing from.<\/p>\n

Smartphones: Big convenience, small real estate<\/h3>\n
\"MobileHomepage view from a mobile phone<\/p>\n<\/div>\n

Because space and bandwidth can be limited on mobile devices, we’ve made sure there are fewer images and less extra information present when you access Noomii from a phone. Banner ads have been hidden away, menus stored at the bottom of the page, and content you want brought right to the top. For those looking for the perfect example, tap tap tap your way over to the Directory<\/a> to see the big difference! Coaches, if you\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re not on our Premium Plus or Premium plans, now might just be the time to upgrade! Being above the fold for your city on a smartphone could be the one thing that gets you a client over others in your area.<\/p>\n

A major reason that people use a smartphone for their web searches is convenience. They want information on the fly so that they can make their decision while running errands or sitting in traffic. Convenience is something that we kept in mind while building the new site, and we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re pleased with the results! Our zip-code search is now at the top of every page, meaning clients can get the information they\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re looking for with a single search.<\/p>\n

And while we at Noomii certainly appreciate the convenience of searching the web from our phones, we also haven\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2t forgotten that phones are for phone calls. Coaches, better change your ringtone to We\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re In The Money<\/a>, because every phone number on our site has been optimized to be readable by smartphones, meaning the number listed on your profile page is just a tap away for someone browsing on their phone. Convenience like this means that even those motivationally-challenged clients out there have no excuse when it comes to giving you a call.<\/p>\n

Tablets: The Goldilocks Dilemma<\/h3>\n
\"TabletTablet view in portrait mode<\/p>\n<\/div>\n
\"TabletTablet view in landscape mode<\/p>\n<\/div>\n

Tablets bring us an interesting use case to optimise for. While not as prolific as smartphones, the number of web users ditching their laptops for an iPad and their bookshelves for a Kindle Fire means there is a growing market of casual mobile surfers to plan and design for. The increased accessibility is great, but it comes with some interesting problems to address. We\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve made sure to blend the smart bandwidth conservation techniques of our smartphone breakpoint with a more feature-rich version of the site for users on those gorgeous retina-display tablets.<\/p>\n

When users browse our site from a tablet in portrait mode, we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve maintained a simple single-column layout to keep all the important bits of information uncluttered and unburied. In landscape mode, however, we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re taking advantage of those extra inches of screen width and bringing the user to a layout far more similar to a desktop than a smartphone. By doing this, we hope that we can create a user experience that is not too sparse and not too overburdened, but one that\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s just right.<\/p>\n

Site-wide Improvements From Our Team of Perfectionists<\/h2>\n

Okay okay, so maybe you don\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2t have the latest technological gizmo gadget. Even still, the improvements to Noomii don\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2t stop with mobile! We\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve done a massive cleanup to the site\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s underlying architecture while making the responsive design changes, meaning all our users will enjoy faster page response times, better visibility and legibility, cleaner interfaces, sharper images, and content that has been better tailored to the diverse landscape of internet-capable devices. On laptops and desktops, our efforts really shine through. We\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve stepped away from the cramped 960px wide layout and embraced the widescreen, delivering content specially formatted to fill every inch of your monitor. Our image library and Javascript base has been rebuilt from the ground up, creating a beautiful, feature-rich layout. And as for squinting? Forget it. We\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re rocking much bigger font sizes, so you can sit back and relax while browsing through client leads.<\/p>\n

And let\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s not just focus on the what-you-see. Some of the biggest benefits of the redesign are things you can\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2t see on our site, but will hopefully see in your inbox! Site redesigns of this scope allow us to more dramatically upgrade and improve our search engine optimization (SEO). We\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve done everything we can to clean up site errors and standardize our content for Google, and with the added responsive features, we should see a pagerank lift in the next few months. Ultimately, all of these changes will help to boost our directory to the top of Google\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s search results for every city–from Alaska<\/a> to Timbuktu!<\/p>\n

Looking Forward<\/h2>\n

Future-proofing a website is impossible, but laying an adaptive framework for all future changes means that we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ll be able to easily scale up with new features. While we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve spent hours and hours testing the public views of the site, our authenticated portion of the site still requires a little TLC and elbow grease before it\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s been polished. Look forward to those changes in the coming weeks.<\/p>\n

For anyone on IE8, we hear you. The site currently appears as a far cry from what it used to be, as you\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re not able to see the results of our hard work. Responsive design forces us to make decisions about which browsers to support, and IE8 is right on the fence. While IE9+ and all other browsers (such as Firefox, Chrome, and Safari) are able to display the responsive features, IE8 cannot. For those who can upgrade to the latest version of IE<\/a>, do so! You\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ll experience the web with the latest software, and the best security, too! For those who cannot, we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ll be rolling out a stylesheet to help patch the issues you\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re experiencing. Ultimately, however, an up-to-date browser is the best solution, so for those on IE7 or earlier, we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re sorry, but we will not be supporting browsers older than IE8.<\/p>\n

Conclusion<\/h2>\n

I hope these months of hard work have paid off and that you\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re all loving the new site. For some of you, this change means that waking up and checking the daily leads happens before you get out of bed. For others, that boost in direct phone calls from clients browsing with their phones should brighten your day. For everyone in small cities and towns, our SEO improvements will help lift you and your city from \u00c3\u00a2\u00e2\u201a\u00ac\u00c5\u201chuh?\u00c3\u00a2\u00e2\u201a\u00ac\u00c2\u009d to \u00c3\u00a2\u00e2\u201a\u00ac\u00c5\u201chired!\u00c3\u00a2\u00e2\u201a\u00ac\u00c2\u009d For everyone else, we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re always working on ways to continually improve ourselves. If the change you want didn\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2t make it into this build, it could be rolling out in the next few weeks. Stay tuned!<\/p>\n

Now that you\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2ve heard from us, we\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2d love to hear from you! What\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2s the change you\u00c3\u00a2\u00e2\u201a\u00ac\u00e2\u201e\u00a2re most excited by? What features will you be taking advantage of, and what are you hoping to see us build into the site in the future? Send us your thoughts in the comments section below!<\/p>\n

Related Posts<\/H3>