1 / 27

The evolution of hrblock.com 2007 - 2010

The evolution of hrblock.com 2007 - 2010. Jonathan Heavner Web Designer www.tenpixel.com/portfolio. hrblock.com - 2007. hrblock.com and taxcut.com at the start of tax season 2007, optimized for 800x600 ( designed and implemented by a third party). Sub pages. Tax Tips main page

tobit
Download Presentation

The evolution of hrblock.com 2007 - 2010

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. The evolution of hrblock.com2007 - 2010 Jonathan Heavner Web Designer www.tenpixel.com/portfolio

  2. hrblock.com - 2007 • hrblock.com and taxcut.com at the start of tax season 2007, optimized for 800x600 (designed and implemented by a third party)

  3. Sub pages • Tax Tips main page • Tax Tips article

  4. Sub pages • Calculators • Customer Support

  5. hrblock.com - 2008 • At the end of tax season 2007 a decision was made to redesign hrblock.com after an extensive study based off website visitor statistics and survey feedback. (taxcut.com also was getting pulled in to be maintained internally from an outsourced vendor and a redesign) • The new design would be easier to read (fonts), easier to navigate with new primary navigation and improved in-page navigation, more accommodating to larger screen resolutions (1024x768), and finally have better branding in alignment with marketing strategies. • During that summer we went through 3 months of design revisions and reviews by business units and executives throughout the company.

  6. hrblock.com - 2008 • After the final layouts were approved, I began cutting assets and coding new CSS for both sites. • taxcut.com launched 11/07, hrblock.com launched 12/07

  7. hrblock.com - 2008 • The homepage ‘help me choose’ flash piece was updated to match the new look of the site.I designed this piece along with the flow of each pod, built by our flash developer.

  8. hrblock.com - 2008 New Tax Tips main page: • Introduced new widgets in thetop section of the page to allow users to be more interactive with site. • Listed all tax tips from A-Z making it easier for users tobrowse content quickly.I designed and implemented HTML framework along with custom CSS for this section.

  9. hrblock.com – 2008 (widgets) • The new ‘grand daddy’ widget (left) was designed to guide users through a series of questions based on the topic chosen. Results would either take the user to an article page focusing more on the topic or start the online product. • The ‘Life & Taxes’ widget (right) was designed to help users by categorizing where they are in life and provide snippets of article information based off the topic they chose.Both widgets designed by me along with page flows, built by our flash developer.

  10. hrblock.com - 2008 New Tax Tips articles: • Overhauled the layout of the article page template by first showing an overview of the article and anchor links which would link to that section within the page. • Introduced print, email, and social mediasharing for users to link back to the site. • Completely changed the in-page navigation to have a full listing of all articles and to highlight to current articleon display. I designed and implemented HTML framework along with custom CSS for this section.

  11. hrblock.com - 2008 New Software main page: • This was a new addition in 2008,the ability to purchase softwarefrom hrblock.com (it was alwaystaxcut.com prior to 2008)Each product brief in the bottomcolumn changes the productdescription section on the top. I designed the flow of this pagewith custom rollover JavaScriptto make it more interactive forclients.

  12. hrblock.com - 2008 New Calculators main page: • Overhauled the layout of the calculator page by designing a newfull feature tax estimator, one ofmost highly used applicationson the site. • Displayed a full list of allcalculators in the bottom halfwith descriptions. Along with designing the newtax estimator, I also developedan HTML, CSS framework to beused for all calculators.

  13. hrblock.com - 2009 • The site redesign was a big success for the 2008 tax season. The web team received a lot of positive feedback from business units throughout the company as well as clients mentioning how easy it was to find information topics quickly, with clear navigation and easy to read content. • This redesign became the foundation for future hrblock.com tax seasons, it was also implemented into other sites maintained by the web team: • H&R Block: Spanish • H&R Block: Puerto Rico • H&R Block: Foundation • H&R Block: Branding

  14. hrblock.com - 2009 • The homepage needed attention this time around, the ‘help me choose’ flash piece needed to be removed in order to eliminate lengthy load times for clients. • This new redesign introduced a cleaner way to find an tax office or start a product. I designed this layout to help emphasize to clients, an easy choice of using the online products at home or to quickly find a local tax office.

  15. hrblock.com - 2009 Tax Tips main page: • Introduced a new design by organizing dynamic content into a tab based layout. • Listed all social media links to keep users up-to-date with tax law changes.I designed and implemented HTML framework along with custom CSS for this section.

  16. hrblock.com - 2009 Software main page: • Simplified the layout of the software products by stacking them from simple to more complex returns.

  17. hrblock.com - 2009 Online Taxes main page: • Introduced a new layout by grouping the online products into categories.I designed and implemented HTML framework along with custom CSS for this section.

  18. hrblock.com - 2009 Online Taxes detail page: • Updated the product detail page

  19. hrblock.com - 2009 New Customer Support page: • Overhauled the layout of the customer support page by grouping items of similar interest into categories.

  20. hrblock.com - 2009 • Homepage mid-season marketing switch • This design went live minutes after the super bowl commercial aired on national television I designed this layout based off the commercial along with assets provided by marketing.

  21. hrblock.com - 2010 • Tax season 2010 introduced a new lineup of products known as H&R Block At Home.The TaxCut name was dropped. • This new lineup was to be categorized under one tab “Do-it-Yourself”.I designed this layout to help emphasize to clients, an easy choice of using the new lineup of online products at home or to quickly find a local tax office.

  22. hrblock.com - 2010 New Tax Tips & Calcs main page: • Based off focus group findings the web team noticed a common trend. Users tended to bounce between tax tips articles and various calculators. The Tax Tips and Calculators pages were combined into one page. • This involved grouping page elements into a clear, intuitive layout. I designed and implemented HTML framework along with custom CSS for this section.

  23. hrblock.com - 2010 New DIY main page: Online • Following the new lineup of H&R Block At Home products’ the “Do-it-Yourself” tab was created. • This involved adding sub-navigation on the main page for Online and Download products as well as adding product comparison and why choose us tabs. • Product colors and photography provided by the product team, this was the first time the site was in alignment with marketing (box shots, title colors, and photography for each product.)I designed and implemented HTML framework along with custom CSS for this section.

  24. hrblock.com - 2010 DIY Online detail page: • Updated the product detail page

  25. hrblock.com - 2010 New DIY main page: Download • Following the new lineup of H&R Block At Home products’ the “Do-it-Yourself” tab was created. • This involved adding sub-navigation on the main page for Online and Download products as well as adding product comparison and why choose us tabs. • Product colors and photography provided by the product team, this was the first time the site was in alignment with marketing (box shots, title colors, and photography for each product.)I designed and implemented HTML framework along with custom CSS for this section.

  26. hrblock.com - 2010 DIY Download detail page: • Updated the product detail page

  27. hrblock.com - 2010 Customer Support page: • Updated the customer support page by introducing the sub-navigation tabs used in DIY

More Related