Student app series

Wireframing the solution

Based on the initial research that I conducted, I began the ideation phase by wireframing the screens for each app concept. To produce an optimal solution, I focused on establishing:

Design system creation

After creating the wireframes and doing data analysis, I understood what to incorporate within each page design. From here, I began my second phase of ideating by creating a design system. Implementing this was essential as a means to standardize components and UI styles.

The design system is the single source of truth for all 3 of my apps. This documentation ensures a consistent product design for all current and future feature implementation. I made sure to document color usage, typography, iconography, and various components (navigation, buttons, inputs, etc.).

User journey flow

As the designs were being iterated upon, I began to finalize the desired user flow for each app. This step helped to define & ensure successful paths for user behaviors. After the flows were completed, they were also used in the test phase to compare actual versus desired actions taken by users.

Finalizing the designs

During the prototyping phase, I began working on high-fidelity mock-ups. This is when my vision for this concept truly started coming together. These designs went through several rounds of iterations before they were ready for user testing. Once finalized, I turned them into interactive prototypes using InVision.