search

AhmedFatthy1040 / accent-optimizer

0 stars 2 forks source link

Design UI for AccentOptimizer #3

Open AhmedFatthy1040 opened 1 month ago

AhmedFatthy1040 commented 1 month ago

Design UI for AccentOptimizer

Description:
We need to design the user interface (UI) for the AccentOptimizer system. The UI should be intuitive and user-friendly, allowing users to upload audio recordings, view pronunciation feedback, and track their progress over time. This issue involves creating wireframes and implementing the initial UI components for the core features.

Tasks:

  1. Create Wireframes:

    • Design wireframes for the key screens:
      • Login/Register Screen: Allow users to sign up and log in.
      • Audio Upload Screen: Users can record or upload their audio for pronunciation analysis.
      • Pronunciation Feedback Screen: Display feedback with detailed insights on pronunciation accuracy.
      • Progress Dashboard: Show the user’s progress over time with visual graphs/charts.

  2. Define UI Components:

    • Identify and design the key UI components, such as:
      • Audio recording/upload button.
      • Feedback display (e.g., accuracy percentage, phoneme breakdown).
      • Progress visualization (graphs, charts, etc.).
      • User profile and settings.

  3. Implement Initial UI Components:

    • Start building the frontend using your selected framework (e.g., React, Angular, Vue).
    • Implement the basic structure for:
      • Authentication pages (login and registration).
      • Audio recording/upload functionality.
      • Feedback display.

  4. Responsive Design:

    • Ensure the UI is responsive and works well on different screen sizes (desktop, tablet, mobile).

  5. Prepare UI for Integration:

    • Ensure the UI components are ready to interact with the backend services via API (e.g., audio upload, fetching feedback and progress).

Expected Outcome:

justFadel19 commented 1 month ago

Assign it to meeeee >w<

mashadawidenko commented 1 month ago

@AhmedFatthy1040 Hi! I'm a UI/UX designer, and I noticed your issue. I can help with the design if that's relevant. What do you think about my proposal? my tg @iamgiaaa