Description:
This To-Do List App is a practical demonstration of my foundational skills in web development. As one of my initial projects, it involves utilizing HTML, CSS, vanilla JavaScript, and Bootstrap for responsive design. The app allows users to add, manage, and prioritize tasks effectively, showcasing my ability to build functional, user-friendly web interfaces.
I focused on a clean, minimalist design to ensure straightforward functionality. The redesigned interface emphasizes task management, removing complex decorative elements to enhance usability. Figma was used for wireframing and mockups, guiding the development process towards a professional and user-friendly design.
The color palette reflects a minimalist aesthetic with functional color coding for different task statuses:
#0A0A0A (Dark Background)
#DC3545 (Tasks Past Due)
#FFC107 (Tasks Due Today)
#17A2B8 (Tasks Due Later)
#28A745 (Tasks Completed)
Initially designed with a bulletin board concept, the app has evolved into a sleek, professional tool focused on task management. The redesign prioritizes usability, reducing visual clutter and enhancing functionality. Icons were added for clarity, and responsiveness was improved to ensure seamless usage across devices.
For the development of the To-Do List App, I used the following technologies:
This project allowed me to deepen my understanding of HTML, CSS, and JavaScript functionalities. I integrated Bootstrap to utilize its responsive design features, focusing on a user-centric approach with a functional and straightforward interface. Challenges included dynamic HTML generation and handling date operations in JavaScript, further enhancing my coding skills.
Committed to accessibility, I ensured the app meets WCAG 2.0 standards through testing with NVDA screen reader and AXE extension. My process included detailed documentation of accessibility testing, reinforcing my dedication to inclusivity in web design.