Monday, June 14, 2010

HappyCog @ RefreshPhilly

I went to a RefreshPhilly talk by HappyCog this evening.  They talked about their process in developing the new website.  They presented four stages of development: information architecture, back-end coding, front-end coding, and design.  Things were not necessarily done in that order, but that was the presentation order.
  • Information Architecture

    This is classification of information within context. It's clumping and separating. It's apples and oranges, but to a botanist or a chef. The information architectural design is going to determine the structure of your menus and links (and probably other stuff).

    Start with a detailed breakdown of the domain (context) you're working within, from a users point of view. Classify them according to importance and according to how well they can be achieved through software, and then clump them into separable categories (experiential goals -- things the user wants to do with the software).

    The presenter recommended a book: Mental Models: Aligning Design Strategy with Human Behavior by Indi Young.  Might be worth checking out. I should also get around to reading those other books like The Design of Everyday Things.
  • Back-end Coding

    This, in the case of HappyCog and the Greater Philadelphia Tourism Marketing Corporation (GPTMC), was construction of the system that the site maintainers will interact with.  It was choosing and setting up a CMS.  It was also deciding how to transfer all the old data into the new system.
  • Front-end Coding

    This was basically taking the design and coding it.  She gave some good best-practices advice, like making landing pages for all top-level menu links (for folks without javascript), and making :hover :focus and onMouseOver onFocus for those people browsing with their keyboards (I do that!).  Also, I like their "megamenus".
  • Design

    I would sum-up design as a word in one of the slides: reinterpreting. It was taking a new [conceptual] image of the city and putting it into a visual statement.  They came up with some emotive themes that they wanted Philadelphia tourism to embody (contemporary, fashionable, and a couple others I don't remember), and evaluated each of their design possibilities against those themes.
Anyways, nothing earth-shattering, but I certainly learned some things, and had other things that I may have already known on some level made salient.

1 comment:

  1. Thanks for your interest in and for going to the Refresh Philly event last night. I hope you got a chance to talk to Veronica Wentz from as well as the Happy Cog team who worked together on the site.

    For the emotive themes that were used in the redesign, GPTMC used findings from usability tests, research and consumer trends to guide the redevelopment.

    It was a great partnership overall.