Cireson_logo

Cireson Responsive website redesign

Project Overview

Cireson is an IT software development company. They were created to empower their users to #domore with Microsoft System Center. They create cutting-edge Service, Asset and Systems Management solutions that maximize their customers current System Center Service Manager (SCSM) and Configuration Manager (SCCM) investments.

Role:

Creative Direction, Branding, UI/UX Designer, Illustration

Deliverables:

Brand Guide, Design System Creation, Complete Responsive Website Design, Manage Development

The Story

Not long after I came onboard at Cireson, we identified there were many areas that the website was lacking. In addition to their brand needing a major facelift, Cireson needed a clean, yet refreshing website with clear user journeys to help showcase what products and services they offer without being too bland and shepherding users to convert and set up a demo with our sales team.

User Research: Competitive Analysis


To begin my research, I id-ed other companies that develop a cloud computing platform to help companies manage digital workflows. I looked at their strengths, weaknesses, opportunities and patterns.


I can get an idea of what the user needs to be fulfilled or what user problems are being solved (or not solved). I also looked into other software companies providing a technical service.


The main finding was that there are there has not been clear customer journeys for users at all different levels to obtain information, take findings back to stakeholder or setup demos. We were putting the burden of knowledge on our customers.

Competitors I researched:

User Research: Observe

Next, I conducted a content audit to distill the most current and valuable information and assets the website had to offer, and we reorganized. Additionally, I met with cross-functional stakeholder across the organization to create a list of requirements and features needed for the new site. The first thing I noticed was the backend of the site would not support the changes in the requirements. This allowed us to get approval to create from the ground up and bring an additional team onboard to build out a robust backend to support of new site.

Define: Find Out Perceptions

Moving on, I worked with the key stakeholders to create an interview guide that allowed us to conduct user research by surveying customers. We followed a structured interviewing process, ensuring that each team member records their interview in a consistent manner. With this guide we conducted 5 user interviews in various “IT Professional” roles (ConfigMgr Admin, Server Analyst, Service Desk, Project Manager and Organization Decision Maker), recording video with the online tool Lookback.io and then scribing our findings on a Miro board.

Define: Research Objectives

We created an interview guide that allowed us to follow a structured interviewing process, ensuring that each team member records their interview in a consistent manner. With this guide we conducted 5 user interviews in various “IT Professional” roles (ConfigMgr Admin, Server Analyst, Service Desk, Project Manager and Organization Decision Maker), recording video with the online tool Lookback.io and then scribing our findings on a Miro board.

The intent of the UX usability testing activity is to identify any usability issues including:

  • Assess whether the terminology is understood by users and appropriate language is used
  • Determine whether the process flows in a logical way
  • Assess if users can effectively navigate through the process using the UI elements
  • Assess whether the content adequately supports users
  • Analysis of how the design measures up against user goals, business goals, project intent, and system or technical constraints

Define:
Understand Needs & Frustrations

Using the trends and themes informed by research, 5 personas were developed based on a sample of 38 survey results and 10 interviews. Each persona has different motivations, needs and frustrations.

Say hello!

DEFINE:
User Flows and Architecture

In order to gain a deeper understanding of users and empathize even more, I created user journey maps to visualize what processes users go through in order to accomplish their goals.


I then mapped out task flows to examine the types of actions users will take and why. By having an entry point, success criteria, and a process flow, I can create a clean and easy to navigate way for our IT Professionals to get where they are going.

DEFINE:
User Flows and Architecture

In order to gain a deeper understanding of users and empathize even more, I created user journey maps to visualize what processes users go through in order to accomplish their goals.


I then mapped out task flows to examine the types of actions users will take and why. By having an entry point, success criteria, and a process flow, I can create a clean and easy to navigate way for our IT Professionals to get where they are going.

Design: Map It out

After getting an idea of what content was needed, I created a map of the website structure. I did a card sort with the 10 users I interviewed to see how users would organize the information. Based on patterns I found in the results, this helped me evaluate my site map and gave me ideas on how to better the architecture of the website.

Lo-Fi Wireframing

After sketching out our wireframes, 
we moved into Figma and created lo-fidelity wireframes.
Following the user journey map, we chose a single ‘IT Professional’ and mapped out the different designs.

The Prototype

We have combined all the elements shown throughout the design process to create what we feel is a functional, fun and approachable website.

The Problem and Solution

We had some major road block along the way–the theme Cireson’s previous site was built on did not support many of the functionality needed in the new site. Should we try and use work arounds to make it work or create a site from scratch? Creating the back-end of a site like this can be very pricey and time consuming. At the time, we decided if we are going to creative a beautiful new presence, let’s do it right!

I was tasks with recruiting and building out a Global team of developers. I managed the administration of all design and web development activities are executed at high quality levels, manage team initiatives, set priorities, and manage timelines and budget. Helped identify and remove impediments, preventing distractions that interfere with the ability of the team to deliver the sprint goal.

Takeaways

Bringing a team in-house vs. outsourcing the project, saved Cireson tens of thousands of dollars and months of the development time.

This redesign led to a decrease drop off rate (20% desktop, 17% mobile), mobile checkout transactions by +24%, upsell conversion rate +30%. 

Additional Credits

Archu Singh (Development), Julie Feller (Copy Writing)

Let's work together

I would love to talk about how I can support and strengthen you and your company. Send me a message sharing information about your project, your budget, and timeline.