Home Upgrade Search Memberlist Extras Hacker Tools Award Goals Help Wiki Contact

Webapp Music Design

Designed a web music-player app:

[Image: BbQc32x.png]

update

[Image: noWn4U1.png]


Looks good buddy! Kinda reminds me too Spotify, but hey. It's good man!
[Image: H3eN0O5.gif]
(Feb 4, 2018 07:42 PM)The Piggy Bank Wrote:  Looks good buddy! Kinda reminds me too Spotify, but hey. It's good man!

Hey thanks man, appreciate the feedback :) do you mind looking at the spotify web-app?

because I did my best to stay away from making it look spotify and i'm quite confident it's far off from spotify.

this is how spotify looks: https://i.gyazo.com/372ff585f769a53d43fb...26796b.jpg

I always do my best to design something unique and something that works 🤝
This looks really good and I like the colors you picked. Are you going to use it or was it just for fun?
[align=center][Image: 0zjTiqk.png]
(Feb 4, 2018 11:19 PM)N1l0c Wrote:  This looks really good and I like the colors you picked. Are you going to use it or was it just for fun?

Thanks man, it was just for fun.
Looks really good, just make the icons on the left + the numbers in the circles on the right smaller. They will be too big when the app is full-size.

UX wise, never put "go pro" or premium sellout top center. Have it in the nav, or somewhere else that's prominent but not center stage, unless you wanna be seen shilling. Next, don't forget to have scrollbars for scrollable areas, I don't see that.
[Image: gjTsm61.gif]
(Feb 5, 2018 11:17 AM)SkullTraill Wrote:  Looks really good, just make the icons on the left + the numbers in the circles on the right smaller. They will be too big when the app is full-size.

UX wise, never put "go pro" or premium sellout top center. Have it in the nav, or somewhere else that's prominent but not center stage, unless you wanna be seen shilling. Next, don't forget to have scrollbars for scrollable areas, I don't see that.

Hey, thanks for the feedback sir :)

Is this better:

[Image: vGRVCb6.png]
Nice colours but there is just way too much going on in my opinion, everything seems a bit too distracting,

the images/UI itself is nice, but there is such a thing as too much gradient aha

Keep it up!
(Feb 5, 2018 11:28 AM)Mister Slyther Wrote:  Hey, thanks for the feedback sir :)

Is this better:

[Image: vGRVCb6.png]

Much better. But look at this:
Spoiler (Click to View)
Those numbers are too big. They also don't look centered. Sometimes, in photoshop/any other tool, when you try and center text in small areas, it does not work well, due to the way text layers work with kerning and such, so I would recomend centering them by eye. Also, since they are so big, the edges of the numbers are very close to the edges of the circle. Personally I think a little negative space would help here. Keep the circles the same size and make the numbers font a bit smaller.

My day job is a UI/UX Engineer, so I'm glad to help an aspiring UI/UX designer, we don't see many in the HF GFX section.

If you have any more questions, just ask.
[Image: gjTsm61.gif]
(Feb 5, 2018 12:32 PM)SkullTraill Wrote:  Much better. But look at this:
Spoiler (Click to View)
Those numbers are too big. They also don't look centered. Sometimes, in photoshop/any other tool, when you try and center text in small areas, it does not work well, due to the way text layers work with kerning and such, so I would recomend centering them by eye. Also, since they are so big, the edges of the numbers are very close to the edges of the circle. Personally I think a little negative space would help here. Keep the circles the same size and make the numbers font a bit smaller.

My day job is a UI/UX Engineer, so I'm glad to help an aspiring UI/UX designer, we don't see many in the HF GFX section.

If you have any more questions, just ask.

I honestly appreciate your time, your feedback is important to my improvement!

You're right,

is this better:

[Image: noWn4U1.png]
(Feb 5, 2018 12:39 PM)Mister Slyther Wrote:  I honestly appreciate your time, your feedback is important to my improvement!

You're right,

is this better:

[Image: noWn4U1.png]

Yup, that's looking a lot better already.

There's a few finishing touches, and small details that you'll learn to notice over time. For example, on the "4" card on the right, the white text on light cyan colour is hard to read. If you were a UI Designer, you probably wouldn't care, but you're a UI/UX Designer, you have to care not only how the app looks aesthetically, but also how the user will experience it, functionally.
[Image: gjTsm61.gif]
(Feb 5, 2018 12:52 PM)SkullTraill Wrote:  Yup, that's looking a lot better already.

There's a few finishing touches, and small details that you'll learn to notice over time. For example, on the "4" card on the right, the white text on light cyan colour is hard to read. If you were a UI Designer, you probably wouldn't care, but you're a UI/UX Designer, you have to care not only how the app looks aesthetically, but also how the user will experience it, functionally.

yes absolutely, i would hate to design something that doesn't work for people.

User experience is also very important I'm aware.
Looks sick! Would deff use this instead of spotify lol
Hey can I ask if you are? Ameer Ashhab.
Just wondering ;)
[Image: n4b6KUJ.png]
(Feb 8, 2018 12:27 PM)Zippy™ Wrote:  Hey can I ask if you are? Ameer Ashhab.
Just wondering ;)

Indeed I am haha, why?

(Feb 6, 2018 07:30 PM)Admire Wrote:  Looks sick! Would deff use this instead of spotify lol

Thank you sir.


Possibly Related Threads...
Thread / Author Replies Views Last Post
by nKRYPTJun 29, 2012 08:30 AM 13 443 Jun 29, 2012 08:30 AM
Last Post: Johnnayeh