For this project, JiWire hired me to help design a Wi-Fi finder web app for their partner, Verizon Wireless. We took an existing partner’s Wi-Fi finder web app I helped with years ago and polished-up the user experience. The Verizon version uses cutting-edge mapping technology, animation and dynamic widgets to create an intuitive directory and mapping experience.

Some highlights include:

• Flash/Google Map integration on landing page
• Use of map icons and “clusters” to group many hotspots in one area, together
• Map and list views side-by-side that dynamically refresh upon moving the map or scrolling the list

Design involvement for this project included project management and creating both interaction and visual design according to Verizon’s design patterns and style guide.

The process for arriving to the redesign of the Wi-Fi Finder  included a structure phase (a user experience document showing design principals, key user flows, screen details and notifications/confirmations/errors chart), a visual design phase (full-color mock-ups of key screens) and a build phase. I was responsible for both the interaction and visual design. Stay tuned for more apps coming out of JiWire in the near future.

Lottay is an online gifting site with a twist. What separates Lottay from the pack is that you can wish for anything—from a cup of coffee to a trip to Europe. They can do this because what you’re receiving in the end isn’t the actual physical gift, but the money friends and family have donated to fund it! Lottay is able to facilitate all of this via a PayPal checkout process.

The Lottay team contacted me to help bring their site to the next level and to do it fast!  Using their existing look and feel, the first task at hand was to design a homepage that made sense to the user and that answered basic questions like: “What is this?” “What can I do here?” “Why should I be here and not somewhere else?” and “Where do I start?” Additional considerations included changing the visual design to add a human element and adding other visual elements that might resonate with their target audience: women, age 25-45.

The home page was just the beginning as we moved onto designing the two key features of the site: create a wish list and give a gift. A user experience document with annotated wireframes was created suggesting the user flows and screen details. The wireframes contained ideas around customization of gifts and wishes and social networking. We then, quickly shifted to the visual design phase where the wireframes were fleshed-out with the existing look and feel. Usability testing was conducted often to test the concepts and get immediate user feedback. Below is an example from the documentation.

The project was to design Martini’s first corporate web site and establish their brand identity. The target audience was both luxury brands seeking online ad placement and publishers catering to affluent consumers. Larger-than-life images were used to create visual impact, reflect the different affluent verticals and help align Martini with other online luxury domains.

Each time a user visited the web site they were presented with a different image that stretched the width of their browser. While the content of the site was limited for this first version of the site, the clean design and large visuals showed that Martini knew who their target audience was.

RICOM, an online seller of refurbished and new IT equipment, approached me with the idea of “re-skinning” their existing web site. I’m always skeptical when clients ask me to re-skin an existing site or application. Sometimes it’s an effort to consciously or unconsciously cover up more serious design problems. Re-skinning a broken design to make a better product is a bit like buying new running shoes so you can run faster. While good visual design is an important element in successful user experiences, it can’t hide more critical problems with navigation, page flows, feature set and a myriad of other issues that might cause a user to leave the site or shelf an application.

RICOM wanted a re-skin, what they got back was a new look and feel AND an online marketing strategy with a clear checkout process. Especially for e-commerce, it’s critical that all the tools are in place to ensure the visitor understands the business from the homepage, knows where to start, has a clear view of their shopping cart, can easily checkout and has support at their fingertips.

Not only did I help them accomplish all those, I also had fun taking a little-known recycle program RICOM had and turned it into a green initiative further presenting the RICOM brand as a smart choice for IT departments.

TerraPass is web site where users can buy carbon credits to help displace their carbon footprint. For this project, I worked with TerraPass and their interaction designer to combine three separate carbon calculators for driving, air travel and home and package them into one. The visual design goals were focused on reducing clutter and presenting the user with a wizard-like experience.

JiWire has a history of building their Wi-Fi Hotspot Finder in just about every flavor you can imagine: toolbars, widgets, plug-ins, mobile apps, etc. This version was v3 of the online/offline Wi-Fi finder which I also originally did the interaction design for. V3 was designed for Windows Vista when the OS first came out.

JiWire was one of the first to have a Mac widget and jumped on the opportunity to build one for Yahoo! when they launched their own desktop widgets. The JiWire widget for Yahoo! had the additional feature of maps. For this project, I designed both the interaction design carried over from the Mac version, and visuals. The screens above show (1) the minimized state displaying a signal strength, network and whether or not the user’s connection was “secure” or not and (2) a screen for searching Wi-Fi hotspots. The screen below is displaying the search results from a hotspot search and a map detail for a selected hotspot.