The Digital Customer Experience

At IMPLERUS Corporation, we believe success starts with a sharp, evocative brand message. We help our clients find their brand’s story, and tell it across a range of mediums in fresh, fun, and unforgettably ways. We take a cross-disciplinary approach—fusing traditional design, UX, brand strategy, and leading-edge code to engineer rich experiences that make deep and lasting connections with consumers. Combined with Amazon’s hosting capabilities and publishing/database options, we have a compelling strategy for digital customer experience.

The Process

Our clients find it helpful to learn the web development process we follow when working on their websites. It helps them plan and anticipate what they need to provide us in terms of content, research information and business strategy. It also helps them figure out in advance the resources and time they need to allocate to the project on their end. And finally, it serves as a backbone for our website-development estimates by providing a robust menu of the several types of services that are required to produce a medium to large website.

Website Development Infographic

Of course, every client website is a little different but we find that most follow a remarkably similar path to completion. We have distilled this process and created an infographic to share with you and your colleagues. We hope you will find it useful when contemplating or embarking on a website development project.

Design – Development Process

For our Lunewave.com project, we utilized a website wireframe mockup to help define the content strategy. Website wireframes tend to be compared to the classic blueprints for any construction project – a clear picture of how things are going to look, in broad strokes.

They are meant to be a practical map, so everyone can see exactly what goes where inside the project. They can be incredibly handy in terms of both product development and communication – aside from being relatively cheap to build.

Just like your good old blueprint, your wireframe has the potential to become your dream-house with the right interactions and components that make an experience great. The wireframe is meant to show your website’s structure, and show the main components of each screen.

Any given wireframe can be split up into 3 different components:

Information architecture: organize every piece of content and visual components to ensure a logical and enjoyable user experience.
Navigation /structure: show global and secondary navigation elements to make sure users can move freely around the product with ease.
Layout design: includes a few visual elements of the interface before the heavy lifting of visual design begins.

A wireframe is basically a map to your website. They are meant to be simple, making wireframes a fast tool to get the design going. But there is another concept at play here, which relates to the degree of detail you apply to your website wireframe: the level of fidelity.

Moodboards

While designing your website’s user experience, mood boards can be an essential tool for helping everyone understand your organization’s:

branding guideline
communication style
personality

This creative process also provides designers with a golden opportunity to experiment with the articulation of your value proposition and positioning statement — critical elements to ensuring your message resonates with your audience.

Furthermore, when mood boards solicit the proper feedback and are presented in parallel with a clickable prototype, we believe they can erase that inescapable anxiety that the creative process can evoke.

What is a Mood Board?

Though mood boards are heavily used by web professionals, they are not exclusive to our industry nor did they originate from it.

Mood boards have a long history in helping people communicate creative ideas and can take on many forms (actual or virtual) in various industries (e.g. fashion, interior design).

Wikipedia describes a mood board as:

A type of collage that may consist of images, text, and samples of objects in a composition of the choice of the mood board creator. Designers and others use mood boards to develop their design concepts and to communicate to other members of the design team.

What is a “Web Design Mood Board”?

Mood boards for web design will focus on a specific set of elements to help communicate how the website’s content and overall user interface would be impacted.At Implerus, our mood boards will experiment with:

color palette
fonts (1 to 3 per mood board)
photography/illustration style
iconography (if needed)
navigation style
spatial awareness (or, white space usage)
overall contrast (helps emphasize hierarchy & structure)

Below are examples we created to determine if the client wished to pursue a “minimalist” approach, a ‘photography-centric’ approach, or a ‘bold product shot’ approach:

Amazon Web Services

By utilizing Amazon’s Lightsail instances with pre-configured WordPress installs, we are able to easily set up a staging area for experimentation. With the “Elementor Pro” plugin, we are also able to provide a simple, easy-to-use interface for the client to make text and graphics changes on their own if desired. In addition, we provide search-engine-optimization with the Youst Pro plugin, making it easier to get the word out through Google, Bing, Yahoo, and other social media services. Amazon’s Route53 service allows us to reserve and configure the domain-name and routing policies for the site.