Design Thinking provided the creative and exploratory aspect of the design process, in continuation the 5 Planes of Design framework structures and evaluates the design solution across different dimensions. Using the data provided from the Design Thinking approach, here is the summary of generated and innovative ideas and concepts that were further refined and shaped into a well-considered and holistic design solution.
The following sections provide an overview of the target audience for the Mindful Minutes (Journal App). Further research and user surveys were taken to gather more specific insights and refined the target audience description. This helped tailor the app's features, user experience and content to meet the needs and preferences of the identified target audience.
Roles (groups of people with similar goals)
- Personal Journalisers
- Individuals who use the app for:
- personal reflection
- goal tracking
- self-improvement
- Individuals who use the app for:
- Professionals
- Individuals who use the app for:
- work-related task
- set targets
- track progress
- Individuals who use the app for:
- Students
- Individuals who use the app for:
- study schedules
- track assignments
- take notes
- Individuals who use the app for:
- Creative (Professionals)
- Individuals who use the app for:
- take ideas
- take inspiration
- track creative process
- Individuals who use the app for:
- Entrepreneurs
- Individuals who use the app for:
- planning
- goal setting
- documenting business journey
- Individuals who use the app for:
Demographics
- Age
- for adults (18+)
- older teenagers
- college students
- Gender
- all genders
- Occupation
- various professional backgrounds i.e.
- corporate employees
- freelancers
- students
- entrepreneurs
- various professional backgrounds i.e.
- Education
- different levels of education i.e.
- high school
- graduates
- university-educated individuals
- different levels of education i.e.
- Geography
- various regions or countries
Psychographics
- Tech-savvy
- Personality & Attributes
- tech-savvy
- digitally fluent
- adaptive to new technologies
- comfortable with digital interfaces
- quick learners
- Values
- efficiency
- convenience
- staying connected
- staying up-to-date with technology
- Lifestyles:
- embrace digital tools in various aspects of life
- rely on technology for communication
- work
- entertainment
- actively seeking new apps for digital solutions
- Goal Orientated
- Personality & Attributes
- ambitious
- determined
- focused
- proactive
- resilient
- Values
- personal growth
- achievement
- progress
- self-improvement
- self-motivation
- Lifestyles
- set clear goals and milestones
- prioritise tasks and activities aligned to goals
- regularly track progress
- seek opportunities for learning and development
- Reflective Thinkers
- Personality & Attributes
- thoughtful
- introspective
- observant
- self-aware
- contemplative
- Values
- self-discovery
- self-expression
- self-reflection
- personal insight
- emotional well-being
- Lifestyles
- engage in journaling
- engage in mediation
- engage in mindfulness practices
- value alone time for reflection
- seeks moments of introspection and self-analysis
- Organised and Productive
- Personality & Attributes
- detail orientated
- systematic
- disciplined
- efficient
- time-conscious
- Values
- order
- productivity
- time management
- effective planning
- accomplishment
- Lifestyles
- rely on schedules and to-do lists
- prioritise tasks
- seek tools and strategies to enhance productivity
- maintain an organised physical and digital environment
- Creatively inclined
- Personality & Attributes
- imaginative
- artistic
- open-minded
- expressive
- inspired by aesthetics
- Values
- creativity
- self-expression
- originality
- artistic exploration
- inspiration
- Lifestyles
- engage in creative pursuits (writing, drawing, photography)
- appreciate art and design
- seek inspiration from various sources
- incorporate creativity into daily life
Based on the target audience, these are the user and client needs for the Mindful Minutes (Journal App).
The user and client needs provide a foundation for understanding the requirements and expectations for both users and the app owner (or developer). By addressing these needs, the app is designed to cater to the target audience effectively and meet client's objectives.
References on Figma screenshot:
- CCPA vs GDPR
- Data Protection EU
- Django Performance
- Performance Optimization Testing Django
- Scaling Django Application Best Practices and Strategies
User Needs
- Personal Journalisers:
- Enable users the ability to record:
- thoughts
- emotions
- personal experiences
- Set personal goals
- Track progress
- Receive reminders and prompts
- Privacy features to ensure their personal reflections remain confidential
- Enable users the ability to record:
- Professional:
- Facilitate task management
- set and prioritise work-related targets
- Be able to track deadlines
- Collaborate with team members
- Schedule appointments
- Integration with productivity tools (e.g. Google Calendar)
- Have reporting options to monitor their work progress, such as visualisation tools
- Facilitate task management
- Students:
- Able to assist students with organising:
- schedules
- assignments
- exams
- Able to take notes and categorise / tag notes by subject
- Be able to set reminders and notifications to stay on top of deadlines or upcoming exams
- Integration with educational platforms to enhance user experience
- Able to assist students with organising:
- Creative Professionals:
- Capture and organise creative ideas (inspiration, visual content)
- Features to enable user to sketch or annotate images
- Ability to create mood boards or visual collections for inspiration
- Integration with design software or image repositories
- Entrepreneurs:
- Enable user to document business ideas, plan and strategies
- Sections to track financial goals, marketing plans and customer insights
- Collaboration with team members and mentors
- Option to export and create reports and presentations for investors and stakeholders
Client Needs
- User engagement
- Provide a captivating and intuitive interface to keep users engaged
- Users should find value in the app's features, leading to regular usage and retention
- Implement gamification elements / achievement rewards to encourage user activity
- Scalability and Performance
- Be able to handle number of users without compromising performance
- Efficient back architecture and database management
- Regular maintenance and optimisation to address any performance bottlenecks
- Data Security and Privacy
- Priority regarding user data security and implement appropriate measures to protect user information
- Compliance with data protection regulations such as GDPR if applicable
- User permission and privacy settings to allow users control over their data
- Continuous Improvement
- Provide opportunities for user feedback
- Regular updates and bugfixes to improve the app's functionality
- Stay up-to-date with industry trends and technological advancements
The Scope Plane defines the overall boundaries and scope of the project, including the Content and Functionality Requirements.
The following content and functionality requirements help define the scope of the project and provide a clear understanding of what needs to be implemented to meet the objectives of the Mindful Minutes application. They serve has a foundation for subsequent stages of the design and development process. These are documented to ensure the final product meets expectations and needs of the users and clients.
Content Requirements
The content requirements refer to the specific content elements and information that need to be included in the project. These requirements define what type of content should be present and what information should be communicated to users. Content requirements include text, images, videos, documents and any other form of media or data.
-
User generated journal entries with fields including:
- title
- date
- content
-
Sections for:
- appointment diary
- day targets
- notes
- what I have learnt
- successes
- wins
- what I could do better
- future ideas
-
Customisable settings and preferences for user profiles
-
Privacy settings to control the visibility of journal entries
-
Integration with a repository for file uploads and storage
Functionality Requirements
The functionality requirements define specific features, actions and capabilities that the application should provide its users. These requirements focus on the desired functionality and behaviour of the application.
-
User registration and authentication system
-
Ability manipulate journal entries:
- create
- read
- update
- delete
-
Search functionality to find specific journal entries
-
Calendar integration for appointment scheduling
-
Task management system with deadlines (and reminders)
-
Collaboration features for shared journals and notes
-
Reporting and analytics to track progress and achievements
-
Admin management functionality to manage users, roles and permissions
The User is the main entry point in this Information Architecture. The User has access to various sections to the Mindful Minutes (Journal App) including:
- Login
- Appointment Diary
- Day Targets
- Note
- Successes
- Wins
- Improvements
- Ideas
- What I've Learnt
Each section represents a specific functionality or feature within the app that the User can interact with.
The simple User Journey represents the typical flow of actions for the User in interacting with the different sections of the Mindful Minutes (Journal App). The User can navigate through the sections, view, create or delete content as per their needs and preferences.
The Admin is the main entry point in this Information Architecture. The Admin has access to various sections of the Mindful Minutes (Journal App). The Admin has access to various sections of the app, including Login, Manage Users, Manage Content and Reports. Each section represents a specific functionality or feature within the app the Admin can manage.
The simple User Journey represents the typical flow of actions for the Admin in managing and interacting with the different sections of the Journal app. The Admin can navigate through the sections, perform CRUD (Create, Retrieve, Update, Delete) operations, manage user accounts and generate reports when necessary.
The Repository is the main component in this Information Architecture. The User Journey includes login to ensure secure access to the repository functionality for authorised users only.
The Skeleton Plan wireframes serve as the foundational blueprint for the visual layout and structure of the web application. It focuses on defining the overall composition of the pages, including the placement of key elements and sections. The wireframes provides a visual representation of the basic skeletal structure of the app's pages, guiding the subsequent design and development processes. It outlines the general arrangement of the header, content sections, and footer ensuring a consistent and user-friendly interface throughout the application.
By keeping the home page clean and uncluttered, users can easily grasp the core concept of the app without overwhelming distractions. The about summary section provides a brief description of the app, highlighting its key features and benefits. To enhance user engagement and encourage interaction, each section includes a Call To Action (CTA) button. These CTAs prompt users to sign up for the app.
Dividing a form into steps can significantly enhance the user experience by providing clarity, reducing cognitive load, maintaining focus, improving error handling and increasing user engagement. Clear progress indicators so users can easily understand their progress and know how much they need to complete.
Types of forms:
- Sign up
- Login
- Contact form
- Using a contact form rather than an email link was the chosen option to provide the user with a seamless experience allowing user to submit inquiries or feedback without leaving the app. Also, this allows users to feel confident in submitting inquiries as it offers privacy and security.
The decision to use collapsible sections on mobile devices while keeping them open and expanded on desktop is based on optimising the user experience for different screen sizes and device capabilities.
The account settings remain simple and using the form structure during the initial onboarding process promotes a user-friendly experience, clear onboarding flow, efficiency in time and effort and reduced decision fatigue. It sets a solid foundation for users to get started quickly and enjoy the core features of the app.
The profile page is accessible and editable in this structure after the onboarding process.
References:
Using Unsplash, with the keywords:
- peace
- mindfulness
- reflection
- journal
- diary
I gathered the selected images, to use as a reference to create a Color Palette.
Image references:
- a black and white photo on a white wall by Annie Spratt
- white printer paper beside black pen by Markus Spiske
- flat lane photo of book and highlighters by Estée Janssens
- white notebook beside white ceramic mug on brown wooden table by Susan Weber
- blue sky with white clouds by Jessica Delp
- selective focus photo of pink petaled flowers by Kien Do
- body of water and snow-covered mountains during daytime by Tim Stief
- white and brown greeting card by Emily Park
- white flowers in clear glass vase by Sixteen Miles Out
- green and white sky by Marek Szturc
- orange flowers by Masaaki Komori
- black stones with sun in the distance b< Siim Lukka
From the Mood Board created under Imagery, I looked for predominant colours and colour combinations in the images that were visually appealing and aligned to the the Mindful Minutes' (Journal App) theme. Using Adobe Color to extract colours from white notebook beside white ceramic mug on brown wooden table by Susan Weber taken from the Mood Board and create a cohesive colour palette.
While considering the colours which would evoke the desired mood, other considerations regarding the application's user interface were:
- provide good contrast
- readability
- accessibility
The combination of Roboto Flex and Caveat variant fonts in a journal app provides a balances between readability, customisation, elegance and personalisation. It allows for flexibility in typography, while maintaining consistency and enhancing the overall user experience.
References:
- Responsive Web Typography v2 with Jason Pamental
- Font Face Observer
- Google Fonts
- Adobe Fonts
- Website Style Guide Resources
- Axis Praxis
- Variable Fonts
- Microsoft Edge Demos - Variable Fonts
- Variable Fonts 101: How to get started with variable fonts
- FF Meta Variable Font Demo
- Getting started with Variable fonts on the web - Kevin Powell
- Interactive animation with variable fonts
- Flexible typography with CSS locks
- The evolution of typography with variable fonts
- Wakamai Fondue
- Google Fonts - Roboto Flex
- Google Fonts - Caveat
- GitHub - GoogleFonts - Roboto-Flex
- TFF to WOFF2 Converter
- V-Fonts
Basic prototypes created in Figma for:
- Laptop and notepad by Nick Morrison
- White work table with notes, smartphone and laptop by JESHOOTS.COM