Goal
June 2018 - August 2019
Designed to help learners build strong drawing fundamentals through interactive lessons and creative challenges.
Client
June 2018 - August 2019
Freelance project
Contribution
User Experience Designer & Researcher
User Research
Qualitative Survey Analysis
Interaction & Prototype Interaction
Design System Management
Usability Testing
Agile Rapid Prototyping & Iteration
Outcomes
Instructional Design Principles - ADDIE Model
Implemented best practices in how adult learners can gain new skills and break down hard concepts into digestible, creative pieces.
Consistency in Visual/UI Interaction
Built trust and reliability through content quality and hands-on practice for both desktop, tablet, and mobile
Flexibility & Freedom of Choice
Created an enjoyable experience that is flexible to busy schedules and encouraging to different learning styles.
Takeaways
Further User Testing
Invest more into user testing to adhere to unique needs for target audiences with or without accessibility needs.
Building Community
Learning is more affective with likeminded friends to share progress with! Invest in creating a community chat functionality and robust rewards system to encourage learning accountability and visible improvement data.
Opportunity Summary
Practicing fundamentals is boring!
Learners know that starting at the fundamentals will build a great foundation for improving at drawing but there is a problem….its boring and overwhelming. More research was conducted and grouped into the 3 main causes for fundamentals being boring and overwhelming:
Debilitate by choice: People get overwhelmed on even starting because of all the choices and videos available (online, libraries, classes etc.)
Rush to the finish: People get anxious and want their skills to match their imagination on the page right away. This can cause a high abandonment issue when this inevitably does not happen.
Distractions and lack of progress tracking: There is a lack of focus and time perception with learners —specifically adult learners with many responsibilities in their lives. There are so many distractions that can discourage people into thinking they are not progressing in any way and keep them stuck in the fundamental/tutorial trap.
How can these issues be addressed?
Break it down into chunks!
Through use research, adult learners react better to being shown the value of doing something first then practicing it immediately. Motivation can only take you so far. Here are the 3 main components the solutions tackled in order to address issues with engagement, flexibility and progression tracking:
Value Proposition Progression: adult learners are assured the reason why to practice something then given creative exercises to see the value through actions. The exercises log progress and shows how well a learner completed the exercises.
Flexible & Repetitive Exercises: Repetition helps build a muscle memory for drawing especially. The different exercises present more structure tasks like following shape patterns, identifying shapes in already finished work and free-hand drawing on top of a finished piece. These exercises are also flexible in that learners would not have to complete a lesson once started but would be encouraged with a refresher option before continuing the lesson. This gives learners freedom of control in their sessions.
Reward System: The applications provides fun rewards like different stylus/cursor styles as you progress which can encourage confidence and retention.
With research and interview data, the hopes is to find out what keeps budding artists engaged and learn what makes them keep going and what makes them lose interest. This also allows for a psychological exploration why makes repetitive task effective for learning purposes. I wanted to prove if my solution architecture approach was translated well to the audience.
The Solution
Interactive drawing exercise with learners drawing on the right hand side panel.
Interactive drawing exercise with learners drawing shapes on a simple image.
Learner revisiting a previously completed exercise to reinforce concepts.
The Journey
Now that the opportunities have been identified, the next challenge is ensure that the visual layout and information architecture clearly addresses the challenges and incorporates the basics of the instructional design found under the ADDIE model.
Analysis (A): User surveys and analysis were conducted to identify specific issues, constraints and goals from targeted learners.
Design (D): Fleshing out the research user flow helped establish an initial starting point in understanding the learner’s choices, paths, and pitfalls in finishing a lesson. According to research with building a drawing foundation, basic shape identification and observation was needed. These basic shapes are of squares, circles and triangles.
User journey map of all possible actions taken from login to dashboard to one interactive lesson
View closer →
Development (D): Wireframes and mockups were created to visual build structure and a common use case path that learners will complete.
Implementation (I): An initial prototype was created within 2-3 weeks after research was synthesized. The hope is to fail quickly and put the instructional design decisions to the test early. The observation goals were to find out what keeps the budding artists engaged and how they interact with the layout without color being a distraction.
Evaluation (E): After initial user testing, we found the following issues:
The dashboard was not clear on where to access other lessons once the first "cube" exercise was completed.
The timing exercise was not completed within the allotted time
People found the UI too large or out of place (causing a distraction)
User testing mid-fidelity wireframes gif
View closer →
Final Design
After initial feedback and one more UI iteration the final design was incorporated with updated brand identity and component library.
Colors and sizing of the UI would change and align with the current level of the learner on the particular lesson: Basics, Median, and Advanced
Image complexity would increase as the lesson moved forward to help with reputation and challenges.
Progress bar and UI was more cohesive and less distracting
Final prototype video
A learner's profile page.
Starting the interactive exercise for "Forms" level 1.
Starting a warm-up before going into a timed exercise.
Starting the timed section after warm-up exercises.
Free hand drawing exercise for a more narrowed focus on content.
Drawing shapes on top of an image to build skills into muscle memory.
Completed the exercise and presented choices to repeat the exercise or continue building the basics.
Reward page filled with fun interactive pen strokes that learners can earn as they learn.
Reflection
The Biggest Challenges!
Clear instructions for different exercises
The wording of certain instructions for the different tests was a challenge and needed several revisions. It was difficult finding the balance between being too verbose and too vague.
Modern, responsive design for 7 different tests
Getting a consensus on each of the exercise designs was a challenge along with developing the UI widgets for responsive design.
Recruitment for user testing
There were scheduling and incentive issues with target audiences.
Future Developments!
Building a community - Integrating social media
A key feature brought through research was that learners find it helpful to share their progress to their socials and get feedback from their peers. This was deprioritized for the final MVP
Expanding the progress library feature
Having a feature to look back at drawing progress increases the momentum to continue learning and practicing. This affects the reward system function mentioned in the psychology research and rewards the learner to view their current achievements and aspire to keep opening the app to continue learning. The feature is displayed on the dashboards but designs that fit with the overall theme of the application is still being uncovered