QIX Tutorial
Introduction
This project is a tutorial developed for Qlik that explains how the QIX engine works. The tutorial is in the form of a web page
and the target audience are developers looking to learn about about the QIX engine.
Demo
You can view an initial version of the tutorial here
The Team
I worked on the tutorial with a UX Designer and developer. My responsibilities were to create the overall styling of the web page and visuals that accompany the text content. The text content was written by the developer.
Process
Background
We had multiple sessions with the developer and watched online tutorials to learn more about Qlik. We also looked at examples of website tutorials.
Brainstorming Visuals and Mockups
While the content was written for chapters, we brainstormed visuals for different sections of the chapters. Scrolling was the primary way to interact with the visuals. We wanted the text and the visuals to tell the same story. As you scroll from one paragraph to the next, that would trigger a change to the visuals or some sort of animation.
We worked closely with the developer who was our subject matter expert. A lot of these concepts were pretty abstract and the challenge here was to visualize them in a way that was engaging and easy to understand.
Brainstorming Visuals
Mockups
I'm a paragraph. Click here to add your own text and edit me. Let your users get to know you.
OUR NEW PLACE
I'm a paragraph. Click here to add your own text and edit me. Let your users get to know you.
Iteration
We went through several rounds of iteration with the developer as well the stakeholders at Qlik. Our visuals had to connect well with the text and be easily interpreted by users.
Takeaways
Collaborating with developers on the design
We communicated a lot with the developer since we weren't as familiar with the content. Having brainstorming sessions and frequent checkpoints with the developer helped us keep our ideas on track and ensure that they made sense.