-
-
cover
Inspiration
The Monnica Beauty web app's accessibility for people with disabilities ensures an inclusive and equitable purchasing experience. It not only broadens the company's reach, but it also shows our commitment to social responsibility and customer satisfaction.
What it does
Monnica beauty facilitates people with disabilities, such as those with visual, mobility, hearing, and neurological impairments, to buy products online from the comfort of their own homes and track the delivery of their purchases.
How we built it
As a team of two designers and two developers, we began by understanding the problem at hand, including present issues, unfulfilled market demand, and obstacles that needed to be addressed. We also identified the intended users and their requirements.
Our solution was to create an e-commerce web application in the beauty business that embraces with "inclusive design" or "universal design" principles. To build the Monnica Beauty web application, we used HTML and CSS to define the structure and design of the website's user interface. React, a JavaScript library, was also used to build dynamic and interactive user interfaces.
Our designers improved various accessibility features, such as
- the Web Content Accessibility Guidelines (WCAG) and the Accessible Rich Internet Applications (ARIA) specification,
- correct colors and contrasts,
- a simple, consistent design to ensure the platform was accessible to all users,
- responsive design,
- a unique style guide that included over 50 design elements,
- high-fidelity prototypes to show all user flow,
- usability and A/B testing with users to refine and improve our design.
Our developers implemented various accessibility features, such as
- alt text for images,
- audio descriptions, captions,
- ensuring screen reader compatibility,
- text-to-speech technology,
- voice control,
- alternative input devices,
- flexibility and customization to meet the unique needs of individual users with disabilities, including keyboard navigation options.
Challenges we ran into
We ran into a number of issues that needed our consideration while working on the Monnica beauty project. We initially spent a substantial amount of time brainstorming and ideating, which caused a delay in the project's actual implementation. Furthermore, we experienced a setback when one of our designers had to be replaced in the middle of the project. The designer was not a team player, which affected our workflow and slowed the project's development. We overcame this obstacle by bringing in new designers who rapidly grasped the concepts and completed the design on time. Our frontend developer didn't connect to the team and he didn't share the code repo link with the frontend developer. So that is why we can't submit the project as a technical track. Finally, we were able to successfully collaborate as a team and produce a high-quality Monnica Beauty web app prototype that met the needs of our customers.
Accomplishments that we're proud of
Despite the difficulties we encountered during the project, our team is proud to have worked cohesively and successfully. We were able to create an innovative and inclusive e-commerce web application in the beauty industry that is accessible to people with disabilities by combining our varied set of skills and expertise. Our commitment to the project and collaborative efforts, we think, resulted in a successful outcome that exceeded our expectations.
What we learned
This hackathon was not only a series of challenges, but it also provided us with numerous opportunities to learn and develop. We overcame a number of obstacles, including bettering our communication skills, providing constructive feedback, and working effectively under pressure.
What's next for Monnica beauty
Our plan is to perform usability studies with different user categories, collect data, prioritize changes, and implement new designs to improve the user experience of our web application.
Log in or sign up for Devpost to join the conversation.