Alexander Ai - Case Study
ALEXANDER is an AI driven content generator that helps anyone who has to write content, to do so quickly, easily and effectively. Alexander has been trained on over 1 million pieces of content and can help you write content in minutes that is both high quality and engaging.
Platform: iOS Mobile App, Landing page (web)
Tools: Figma, Webflow, Adobe Illustrator
Timeframe: 3 weeks
Role: Product Designer
Collaborators: Jes Jarvinen, Marina Lilley
Project Brief
The stakeholders of Alexander Ai approached my team and I with the task to create a landing page and mobile solution for their product.
I created suggestions to a visual direction and designed a landing page and a high-fidelity prototype for an iOS mobile app.
This project was conducted with a team of 3 members being Jes Jarvinen, Marina Lilley, and myself. We conducted user research and testing together and branched off for the design process and final product.
How might we…
How might we create a user-centric design that creates a pleasant and smooth experience for the user?
How might we utilize design to influence user retention?
Research
The research process for this project consisted of 4 major steps.
Provided Assets: first and foremost we utilized low fidelity wireframes provided by our client as a starting point on how to organize our site and navigational elements.
Competitive Analysis: We conducted a competitive analysis on the market including direct and potential competitors. Through this process we audited their strengths, weaknesses, features, and design language to decide on what crucial elements we would need to apply to our product. Below are some of the competitors we analyzed.
User Research: we utilized Optimal Workshop to conduct a card-sort to better understand user mental models for site navigation. The results of the card-sort indicated that our users preferred
simplified top navigation
putting “tips and tricks” tab under “features”
including blog tab in the top navigation
moving information about the product to be readily available in the top navigation
technical and logistical information should be placed in the bottom navigation
User Testing: we built out mid fidelity prototypes, gave our users a task to complete, and collected data from their experiences. During this user test, users were asked to navigate to the “Tips and Tricks” screen as a testing of the site map and navigation determined through prior research and testing.
Through our card sort and user prototype testing, we were able to develop our sitemap from its first iteration into its final format.
High-fidelity Wireframes
After the process of researching, testing, synthesizing data, and wireframing, I diverged from my teammates and created a high-fidelity version of the final product. Keeping in mind feedback from our users, I strove to present a competitive design with modern and minimalistic styling for a smooth and intuitive user experience.
This was achieved by implementing a slightly modified color pallet and softer design language to create a product that is competitive in today’s market.
