Optimize/Redesign layout of web app, especially mobile

Kilpailun tehtävänanto

I need someone to help optimize the layout/design of my web app. The two app pages are 1) transform, and 2) artist browser. I've included pictures of my existing layout.

As a summary of what this interface is used for - people will choose an artist, select their controls, hit 'Generate Vocal', and then their resulting audio will appear under 'Output Audio'.

I've had a hard time determining how to layout desktop vs mobile, and it just doesn't feel great. For this contest, I'd like to see mockups for desktop screens, tablet screens, and mobile screens, for both the transform and artist browser pages. Wireframe is fine if it shows off everything properly. If you are good at TailwindCSS, we could also discuss further compensation to modify my existing design to fit the design that I choose.

The general issue is I don't feel the flex design works great I resize the screen. I have wondered if I should opt for a more fixed layout (with breakpoints for screen sizes) instead of the current setup.
Specific areas I need fixed/optimized:

Transform Page:
- The 'browse artists' button feels a bit out of place to me, but i don't know if there's a better place to put it
- There's empty space below the Artist Info section, which feels wrong to me
- For desktop view: Generate Vocal button is arguably the most important button on the whole app, yet feels a bit tucked off to the side, and the Output Audio section is also very important and seems a bit pasted onto the bottom of the window. I'm wondering if there's a better way to lay this all out.

Artist Browser Page:
- The 'preview' section is where people can listen to four different audio demos showing off the artist they're interested in. The current design of that element feels bad to me, especially on mobile - it's hard to even press the play buttons. Also, it just takes up a lot of room, which is an issue on smaller screen sizes. I'm wondering if there's a way to rethink how people listen to demos - for example, maybe there could be a single small play button, and the genre selection is part of the section above the artists (the "Filter by Tags" section). Open to ideas on that.
- The filtering by tags section doesn't work well on small screens either. I'm wondering if this should be re-designed, maybe with a filter button that pops up a selection of filters. Again, open to ideas.
- The select artist button is huge on desktop, but i'm not sure how to deal with that
- The text "Find the sound you want and hit Select to view transformation controls' is currently under 'Artist Browser' and i'm wondering if it could be in a better place than being right under the title of the window.

I think that covers my issues, please let me know if you have any questions, and I just want to reiterate that I am open to modifying the entire layout if needed.

Suositellut taidot

Työnantajan palaute

“A+, would work with him again”

Profiilikuva vocalistai, United States.

Kilpailun parhaat työt

Näytä lisää töitä

Julkinen selvennystaulu

  • daffaalberta
    • 2 kuukautta sitten

    Please don’t close the contest until time ends. I’m still working. Thanks

    • 2 kuukautta sitten
  • mehergulati
    • 2 kuukautta sitten

    I'd be more inclined to participate if this was guaranteed

    • 2 kuukautta sitten
    • 2 kuukautta sitten

    #guaranteed #guaranteed

    • 2 kuukautta sitten
  • prokidsillustrat
    • 2 kuukautta sitten

    I think we need to make some more changes to make the design more attractive. I can do that if you want. Kindly provide me the original files and connect with me. Thank you

    • 2 kuukautta sitten
  • prokidsillustrat
    • 2 kuukautta sitten

    Working on it

    • 2 kuukautta sitten
    1. prokidsillustrat
      • 2 kuukautta sitten

      Here are some good design ideas copied by others. So please message me to see my designs. No doubt I will design exactly as you want. Waiting for your message.

      • 2 kuukautta sitten
  • Swarnapriya7
    • 2 kuukautta sitten

    #guaranteed #sealed #sealed

    • 2 kuukautta sitten

Näytä lisää kommentteja

Kuinka päästä alkuun kilpailuiden kanssa

  • Ilmoita kilpailusi

    Ilmoita kilpailusi Nopeaa ja helppoa

  • Saat valtavasti töitä

    Vastaanota tonnikaupalla osallistumisia Ympäri maailmaa

  • Myönnä palkinto parhaalle työlle

    Myönnä palkinto parhaalle työlle Lataa tiedostot - Helppoa!

Ilmoita kilpailu nyt tai liity tänään!