INTRODUCTION.
- K1 – Applied creative design thinking to tackle a social issue (screen overuse and myopia).
- K7 – Aligned the product with real business and user needs within the health sector.
- K11 – Demonstrated deep understanding of user needs and behaviours by identifying motivations, pain points and goals.
- S1 – Created a user-centred digital solution using a clear design strategy.
- S11 – Used research and persona insights to guide functional and behavioural design choices.
- B1 – Demonstrated enthusiasm and initiative in solving a real-world problem creatively and independently.
In today’s digital age, managing screen time effectively poses a significant challenge, particularly among young people who are increasingly exposed to digital devices. The Vision Guard project, which I developed in response to a brief from 21 Grams, aims to mitigate the growing concern of myopia through a thoughtfully designed digital solution. My app is designed to encourage healthier screen habits through a user-friendly, engaging, and intuitive platform that simplifies the process of monitoring and reducing screen time while promoting outdoor activities.
Throughout the development process, I focused intensely on understanding my user personas, identifying their needs, preferences, and the challenges they face with digital consumption. Vision Guard seamlessly integrates features like personalized activity recommendations, interactive tasks to break screen time, and rewards for achieving set goals.
Employing user-centric design principles, I crafted a journey that not only educates users about eye health but also empowers them to make significant lifestyle adjustments. The app’s architecture and navigational flows are built to ensure a smooth, engaging user experience, encouraging sustained interaction and long-term behavior change.
DESIGN PROCESS.
STATISTICS.
- K8 – Conducted critical analysis of research data, including public health statistics, surveys and trends.
- K16 –Stayed up to date with emerging health concerns and used this knowledge to shape the solution.
- S12 –Used research methods (including surveys and empathy mapping) to inform your digital design process.
- B5 –Showed accountability by basing design decisions on real data and user feedback.
These statistics highlight a significant concern: an overwhelming 65% of teenagers wish to reduce their smartphone use, which is a telling sign of growing awareness about digital overuse. At the same time, it’s evident that our screen time is heavily skewed towards social media, with around 70% of it being spent scrolling through feeds, which raises questions about the quality of our digital consumption. On a broader scale, myopia is affecting a staggering 1.5 billion people worldwide, making up 22% of the population, illustrating the widespread impact of our screen-centric lifestyles. These numbers not only underline the necessity of apps like Vision Guard but also paint a clear picture of the digital habits that we must reshape for the sake of our health and well-being.
SURVEY.
Our research unveils striking statistics that illuminate the relationship between today’s youth and their smartphones. A significant 65% of teens aspire to bring down their screen time, suggesting a collective awareness of overindulgence in digital consumption. Remarkably, social media claims 70% of our screen engagement, emphasizing its pervasive role in daily life. With 85% of people voicing concern over the potential harms of screen time on eye health, the demand for change is evident. Vision Guard responds to this call to action, offering a promising avenue for individuals to recalibrate their screen habits and foster outdoor activity, thereby championing digital wellness in a screen-saturated age.
EMPATHY MAP.
- K11 – Built a user-centred experience through a deep understanding of user motivations and barriers.
- K9 – Applied interaction design knowledge to address emotional and practical user concerns.
- S11 – Created realistic personas and empathy maps to anchor design choices in real user contexts.
- B3 – Showed care and consideration for others by designing for emotional and mental wellbeing.
The Vision Guard Empathy Map provides insightful glimpses into the daily digital interactions that shape our routines. It encapsulates the excessive use of smartphones and computers, often driven by both work and leisure, revealing our ongoing battle to curb screen time without the necessary tools or support. As we engage with a world of constant notifications and observe friends and family tethered to their devices, the map reflects our own usage and the pervasive nature of technology in our lives.
Internally, there’s a concern about the long-term effects of screen use on our well-being and eye health, paired with a recognition of the need for change but a lack of clarity on how to achieve it. The empathy map also tunes into the advice and worries expressed by those around us, underscoring the commonality of our experiences. Pain points such as eye strain and its impact on our sleep and relationships are felt widely, yet the hope for a solution is equally shared. The vision of better eye health and a balanced lifestyle through effective screen management is the driving force behind this project, painting a picture of an attainable, healthier future.
USER PERSONAS.
In developing Vision Guard, I crafted detailed personas to anchor the design process in real user needs. Take Michael from Manchester: a solicitor entangled in the unending cycle of news consumption, his smartphone use spills over, impacting precious family time and his mental well-being. Then there’s Emma, a budding influencer from London, who battles the relentless demand for social media presence, leading to disrupted sleep and anxiety. These stories, grounded in everyday experiences, highlight the necessity for a solution like Vision Guard.
Each persona brought to light specific goals and frustrations, from the need to break free from the screen to the desire for more meaningful offline interactions. Michael’s aim to cut through the noise of constant updates and Emma’s struggle to balance her online and real-life personas informed the empathetic design of Vision Guard. It’s an app that’s not just functional but also mindful of the complex relationship we have with our digital lives, aiming to restore balance and well-being.
low-fidelity wireframes.
- K9 – Applied interface and interaction design principles across the iterative stages.
- K10 – Considered responsive and accessible design in early and final layouts.
- S13 – Designed with accessibility in mind, including structure and navigation.
- S16 – Delivered functional and visually consistent wireframes using industry-standard tools.
- B4 – Maintained attention to detail and consistency across all design stages.
The initial stages of Vision Guard’s design are laid out in a series of hand-drawn low-fidelity wireframes. These simple sketches map out the essential structure of the app, focusing on the user’s journey through key features such as the home screen, profile, and task areas. Each wireframe is a visual representation of the app’s layout, providing an early look at how users will navigate Vision Guard and interact with its tools to manage screen time and improve their eye health. These drawings form the bedrock of the app’s design, ensuring that every element is placed with purpose and user-friendliness in mind.
MID-FIDELITY WIREFRAMES.
The mid-fidelity wireframes for Vision Guard mark a pivotal transition from paper to pixels, where the foundational sketches evolve into digital blueprints. These wireframes retain the simplicity of early concepts but are enhanced with the precision that digital tools provide. At this stage, the focus is on the structure and functionality of the app’s interface, layout, and user interactions.
Key screens and features are mapped out with placeholders and grids that define the space without the influence of style or color. This phase is essential for iterative testing and refinement, allowing for a detailed examination of user flows and feature placements. Through these mid-fidelity wireframes, Vision Guard’s commitment to user-centric design becomes evident, setting a solid foundation for the subsequent layers of visual design and interaction details.
HIGH-FIDELITY WIREFRAMES.
- K10 – Ensured intuitive navigation and clear structure across the platform.
- K13 – Applied industry standards in organising content and user journeys.
- S6 – Designed interface layouts that promote clear call-to-actions and logical pathways.
- S9 – Created well-thought-out user journeys to support app usability and engagement.
The high-fidelity wireframes for Vision Guard represent the culmination of meticulous planning and iterative design. These wireframes elevate the project from conceptual sketches to a refined digital prototype, providing a detailed representation of the app’s visual aesthetics and interactive elements.
In the high-fidelity wireframes, every aspect of the user interface is carefully crafted, from typography and color schemes to iconography and button styles. These wireframes capture the essence of the final product, offering a preview of the polished design while retaining the functionality and user flow established in earlier stages.
With the inclusion of realistic content and imagery, the high-fidelity wireframes provide a more immersive experience, allowing stakeholders to visualize the app in its entirety. This level of detail also facilitates user testing and feedback, ensuring that the design meets the needs and expectations of its target audience.
CONCLUSION.
- K16 – Reflected on current and emerging practices within UI/UX and health tech.
- S5 – Solved a real-world digital challenge by building a working solution from idea to prototype.
- B1 – Demonstrated curiosity and independent initiative throughout the entire design process.
- B5 – Showed responsibility and motivation to keep the user experience central to your work.
What started as a response to a challenge from 21 Grams has blossomed into a powerful tool for tackling the pervasive issue of excessive screen time and its associated risks, such as myopia.
Through meticulous research, thoughtful design, and iterative testing, Vision Guard has transformed into more than just an app—it’s a beacon of hope for those seeking a healthier digital lifestyle. By providing users with the tools to manage their screen time effectively and encouraging outdoor activities, Vision Guard aims to alleviate the strain of constant device usage and mitigate the potential health consequences.
As Vision Guard prepares to transition from prototype to product, our focus remains steadfast on solving users’ problems and improving their quality of life. User feedback will continue to guide our efforts, ensuring that Vision Guard remains relevant, user-friendly, and impactful in addressing the evolving challenges of the digital age.
In closing, Vision Guard represents not only a solution but also a commitment to fostering a healthier, more balanced relationship with technology—a testament to the transformative power of design in addressing real-world problems and enhancing human well-being
Throughout the development process, we’ve incorporated a deep understanding of user personas, their needs, wants, pain points, and prior experiences, ensuring that the app caters to the unique requirements of our diverse target audience. By leveraging user-centric design principles, customer journeys, calls to action, information architecture, and navigation, we’ve created an app that empowers users to make healthier meal choices without the hassle.
