Middlecon UX Case Study

Middlecon

Middlecon is a Swedish company founded in 2010 that specializes in handling and transferring large volumes of data in the realm of Big Data. They are focused on delivering high-quality solutions for big data management and artificial intelligence, utilizing technologies such as InfoSphere, DataStage, and various IBM solutions. With a team of experienced consultants, Middlecon collaborates with technology partners like IBM and Cloudera to provide businesses with tailored solutions that meet their specific needs.

Middlecon’s Requirements

Middlecon had an existing web site with a blog. They recently engaged us to redesign this page with the aim of enhancing the overall user experience and acquire new leads. Special emphasis was placed on the content structure and hierarchy (site architecture). They specifically requested the website to be implemented on the WordPress platform to enable independent addition of future blogs and posts.

View the full case study to learn more →

Design Process

During the project, an iterative approach was applied. The process began with a requirements workshop and concluded with the launch of their new official website. User experience design phases included establishing information architecture and site mapping, followed by wireframing, and ultimately detailed design. Middlecon provided the foundational concept and several concept drafts in FigmaJam, which the CROZ team built upon and further enhanced.

Information Architecture

It was essential to define relevant information. Before the initial design phase, all segments of the Middlecon website were meticulously specified to ensure their proper arrangement. This step encompassed the definition of key messages, offered services, and showcased services that would be an integral part of the website. After this definition, the information was carefully structured. The specific design and functionality of each individual page were agreed upon, including the layout of elements, their hierarchical structure, and methods for integrating the mentioned information.

Wireframing

Following the development of the information architecture, wireframes were created to visually represent the basic layout of the website’s elements. In this phase, the primary focus was on defining the placement of essential elements such as text, images, buttons, and similar components, without delving into the intricacies of visual design. Once the wireframes were finalized, they were forwarded to the relevant parties for evaluation. Compared to earlier versions, new pages were added: “Apply for Job”, “Careers”, and “Job Positions”.

High fidelity design

Following the completion of the wireframing phase, the process transitioned to the detailed design phase. Each individual screen was meticulously designed using Figma. During this stage, the branding of Middlecon company was integrated. Once each screen was finalized, they were presented to the client for approval. After a thorough review, areas for improvement were identified, leading to the revision of the sitemap and the creation of wireframes for additional screens.

Project takeaway

During the project execution, we implemented a series of user experience design techniques and specialized tools. We used Figma for user interface design, while WordPress was employed for website deployment. The user experience design process was iterative, a standard practice, and continued until the usability tests showed a great user experience and the client was fully satisfied. A detailed analysis of this project can be found in our Case Study.