Redesign Button Mock Up

[JoseLQV]

Objective:

Redesign the button interface to improve user experience and visual appeal. This includes designing search bar locations, adding a Light Mode and Dark Mode setting option, and refining the design of the three bottom buttons (Add A Report, Current Location, and Notifications).

Task Description:

This task involves creating a new mockup design for key user interface elements:

Search Bar Location: Design and place the search bar in an optimal location for ease of access.

Light Mode and Dark Mode Setting Option: Implement a toggle button that allows users to switch between light mode and dark mode.

Redesign Bottom Buttons: Add A Report: Update the design to ensure it is visually consistent with the rest of the UI. The "Add A Report" feature will allow users to add a comment. Current Location: Make design changes that improve its visibility and accessibility. Notification for all Reports: Redesign the notification button to ensure it effectively communicates new updates and aligns with the overall aesthetic. Implementation:

Create mockups for each new design using design tools like Figma or Adobe XD. Design the Light/Dark mode toggle button and integrate it into the mockups. Update the layout and appearance of the three bottom buttons, ensuring consistency across all modes. Gather feedback from stakeholders on the initial mockups and make revisions as needed. Subtasks:

Design Search Bar Location:

Draft different placements and styles for the search bar. Gather feedback and refine the design. Create Light/Dark Mode Toggle:

Design a toggle button and determine placement. Test the mockup in both light and dark modes. Redesign Bottom Buttons:

Create individual designs for the "Add A Report" (comment feature), "Current Location," and "Notification" buttons. Ensure the design aligns with the overall app theme. Conduct usability testing for the redesigned buttons. Testing and Debugging:

Test the mockups with a small group of users to gather feedback on usability and design. Ensure that the Light/Dark mode switch does not impact the usability of the other buttons. Debug any issues with button alignment, contrast, and accessibility in both light and dark modes. Iterate on the design based on testing feedback to refine the final version.

Deadline: Milestone 2

Complete the task by Monday, October 21, 2024, at 11:00 PM (23:00), in alignment with the week of the Milestone 2 deadline.

[YanehRuiz]

Please add the missing tags ^^

[JoseLQV]

[YanehRuiz]

This issue isn't approved by managers or TLs and issues cannot be closed by developers. Please add the missing tags and wait for the review before adding the completed tag. Thank you!

[JoseLQV]

A que te refieres con tags?? No entiendo

[lex939]

@JoseLQV Please refer to #4 for tag (label) [i.e. Pending Approval, Approved, Completed] placement for issues.

Please also note that the act of a developer closing an issue may lead to an invalidation of the issue and, therefore, an invalidation of the points assigned for said issue.

[YanehRuiz]

A que te refieres con tags?? No entiendo

Los labels! Debes poner el label de tu team y del current milestone en los issues que abras. Entonces cuando tenga los labels de "aprobado" por manager y "aprobado" por los team leaders, le puedes poner el label de "Completed" una vez termines de hacer el issue.

[JoseLQV]

Sorry