iCrossing mobile site

A year after my first go at designing and developing iCrossing’s mobile web presence (then known as mCrossing), I was tasked to build a new one to reflect the updated internal rebranding. My starting place was to use the World Wide Web’s (W3C) Mobile Web Best Practices, allowing optimal styling while still degrading to lower end devices as well.

The thing I am most proud of is the navigation system. Due to lack of screen space, a navigational system for mobile devices can be quite tricky, especially with secondary and tertiary navigation. The solution I came up with, which I have never seen anywhere before, was to include breadcrumbs in the global navigation. Combining these two elements assured the user could jump back and forth to wherever they wanted to regardless of how deep in the site they were. There’s visual feedback for which section of the site you’re in (global nav) as well as how deep (secondary or tertiary pages).

While image use was kept to a minimal to allow for quick page-loading, I tried to carry over a few motifs from the wireline site—mostly the color palette. Because the image size is constrained to a very small size, I added a thin vertical red line to strengthen the red color from the wireline site. I also drew custom icons in the footer using the same color palette.

Check out the site at mobile.icrossing.com.

Work completed: April 2007
Tagged as: interface, mobile, site, ui, usability, web, web standards