David Gee

Interactive Design & Development

Co-Exprise CX4 Overview

The Co-Exprise CX4 platform is a SaaS application providing end-to-end supply chain management and sourcing tools, designed specifically to address the complex needs of global direct manufacturing operations.

Design concept for the Simple RFQ module.
The MBoM control.
Hierarchical tree controls are available to power users, but completely optional.
The Awarding phase of a sourcing project.
Persistent nav controls provide quick access to bookmarked and recently used projects & suppliers.

Overview

The primary concept behind the CX4 application is a collaborative, web-enabled process for direct manufacturing sourcing operations. While there are many supply chain management tools out there, most are designed around relatively simple indirect manufacturing and services processes. The CX4 app was built to enable large-scale, multi-lot sourcing projects with thousands of biddable items to be accomplished online.

Design Considerations

The existing process for direct manufacturing relied heavily on complex Excel spreadsheets and offline or email collaboration. Our target user base is heavily Microsoft-centric, with over 75% of our users still using Windows XP with Internet Explorer 6. Existing interaction patterns and workflows had to be taken into account when designing the application, and we modeled the interface to loosely follow the Windows XP design guide.

Another challenge with corporate SaaS apps is that decision making purchasers often have very little actual interaction with using the application. Strict process controls and user tracking were a strong requirement, and we worked hard to implement these without impacting the end-user experience.

The interface needs to cater seamlessly to administrators, managers, buyers, and suppliers. In some cases the difference is clear-cut — suppliers are presented with a unique, simplified task-focused interface. Other scenarios are less well-defined — the boundary between project structure and process isn’t always predictable, and any given user may take on differing roles across seperate projects. One of our primary challenges was to ensure that the interface scaled across a broad range of user needs.

Technical Considerations

With the vast majority of our user base on IE6, we had to rely heavily on Javascript for the application layout. Visual design was complicated by lack of support for 24-bit PNGs, as the existing IE6 workarounds have a high performance impact on data-heavy apps. The application also relied on ActiveX to power the 3D document viewer and real-time messaging, ruling out cross-browser development.

My Role

Initially, I was brought on solely as a designer - my responsibility was to work with the company principals to define the functional requirements, create interactive mockups which could be used to demo our vision, and to iterate quickly on new concepts. Having done a fair amount of web development work in the past, we started building out the prototype with HTML, CSS & Javascript, with the understanding that iteration speed was the priority, and that our offshore developers would transform the prototype into production-ready code. This idea didn’t last very long, and I soon found myself in charge of front-end development as well, building complex Javascript controls.

Design Process

Our design process focused heavily on rapidly iterating on a high-fidelity prototype, which was also repurposed for marketing & client demos. CX4 was used internally by our market-making teams to run our own sourcing operations, and provided valuable feedback as we were working on new features.

We followed a Lean UX methodology — design for a new module typically involved a few sessions of brainstorming & whiteboard sketching, some rough Photoshop or Illustrator wireframes, then transitioning to the HTML prototype for detailed interaction flows. The prototype would be presented to existing clients for feedback before production development. More recently, we began to run basic but more formalized user testing, and experimented with using Balsamiq for wireframing.

Other Projects

I worked on multiple other projects during my time at Co-Exprise, not all of which can be shown here. A partial list includes:

    • Program & Project Management

      Provides high-level insight across organizational hierarchy and multiple projects into buyer activity and workload.

    • Activities & Purchase Orders

      Simple workflows that exist outside of the regular project structure.

    • Contracts

      Workflows and interface design around contract management, digital signatures, etc.

    • Document Viewer

      A proprietary ActiveX technology that can read multiple 2D & 3D document formats and convert and compress them into a common standard for viewing on the web, with full access control and content expiration controls.

    • Repositories

      Persistent libraries of items, documents, and cascading levels of project templates, allowing users to easily repurpose repeating projects.

    • Real-Time Negotiations

      A reverse auction bidding console, featuring patented bidding controls and real-time communication.

    • REACH Compliance

      Environmental manufacturing compliance controls.

    • Administration

      Administration modules for customizing the app for different co-brands, taxonomy builders for commodity coding, geographical classifications, etc.