Jump to content

Showcase websites: Spotify, Steam, etc.


Recommended Posts

mP9ksRt.jpeg

Orice tip de părere este bine venit, încă mai sunt pagini de lucrat însă acesta este "finished" după punctul meu de vedere. Nu este nimic în html/css, este doar un prototype în figma făcut la plictiseală (după 1 an de a nu pune mâna pe acest program) și mă gândeam să îl împart cu voi pentru păreri/sugestii.

@Juliano Dillon @Ștefan A. (dacă nu vă deranjează).

  • Like 2

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

E interesant, nu pot sa zic ca nu imi place, e putin mai clean din cum stiu eu ca arata interfata Spotify (nu prea folosesc). Am mai vazut cateva redesign-uri de genul la platforma asta, insa nu prea cred ca e ce trebuie, adica e o platforma caruia cu greu poti sa ii aduci ceva nou, din cum vad eu lucrurile. Ai putea incerca redesign la platforme precum Steam, Discord, etc., cred ca ar iesi ceva mult mai interesant acolo.

  • Like 1
Link to comment
Share on other sites

4hCVtCw.png
 

@Juliano Dillon Am luat în considerare și propunerea ta și am decis să fac un redesign la Steam. Mi-se pare o versiune finalizată momentan, am încercat să o fac că în stilul UI-ul de la PS5

Aș vrea un moderator să dea edit la titlu cu "Showcase websites" pentru că am început să le fac din plictiseală și îmi place să ascult părerile altora :D (thanks)

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

Altceva acum :D. Totusi trebuie sa tii cont ca steam ofera mai multe informatii si are un design mai mult de website si atunci nu prea poti sa-l faci in stilul UI-ului de PS5, adica el arata bine, dar o versiunea reala nu ar fi posibila in varianta asta. Super tare oricum. 

  • Like 1
Link to comment
Share on other sites

Posted (edited)

54Ts9HW.png

Creat în React cu framework-ul Next.js pentru a-mi readuce aminte de puținele cunoștințe pe care le aveam, încă sunt mai multe de făcut la el (cum ar fii o pagină pentru proiecte viitoare). Design-ul a fost făcut dintr-un prototype pe care îl aveam pe Figma de acum 1 an.

Un live se poate vedea aici însă nu este nimic special: https://stefan-frog.vercel.app
Acum încerc să lucrez un api pentru spotify unde arată ce muzica ascult în timp real.

(în caz că vă interesează, deployment-ul l-am făcut pe vercel.com)

Edited by sharosky
nou link

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

6TbTTrw.png

NOWPLAY este proiectul imaginar făcut de către mine, noua comunitate pentru gameri pentru a se conecta online să își împartă replay-urile cu meciurile lor și a comunica off-topic sau on-topic pe forumul comunitar.

Păreri design și idee, se merită să fie deschis ceva?
@Juliano Dillon (fiind singurul activ de la care pot lua o părere serioasă, thank you :MemeTroll:)

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

Arata bine, imi plac culorile, dar in prima prezentare pentru "NOWPLAY" ai multe elemente exagerat de mari, transforma-le la un size mai rezonabil si umple golurile lasate, ai foarte mult spatiu cu care te poti distra, trebuie doar sa ai cateva idei de ce sa adaugi acolo, in rest arata interesant.

Cum e gandit mai exact? Ce te-a inspirat?

  • Thanks 1
Link to comment
Share on other sites

45 minutes ago, Juliano Dillon said:

Arata bine, imi plac culorile, dar in prima prezentare pentru "NOWPLAY" ai multe elemente exagerat de mari, transforma-le la un size mai rezonabil si umple golurile lasate, ai foarte mult spatiu cu care te poti distra, trebuie doar sa ai cateva idei de ce sa adaugi acolo, in rest arata interesant.

Cum e gandit mai exact? Ce te-a inspirat?

Inspirația provine de la aplicațiile de replay (spre exemplu medal.tv) însă partea video vine mai mult de la Twitch (de asta și foarte mult spațiu gol însă vă fii lucrat mai mult) care vine combinat cu Reddit-ul (partea de comunicare care vă fii limitată probabil).

Platforma în sine trebuia să fie all-about the gamer, un fel de prezentare cu content-ul postat (și video cât și text). Ideea însă încă rămâne on-hold pentru un alt viitor unde o să îmi permit să îl fac. Intre timp am făcut și un design pentru profil:

5pdXZ3y.png

Țin să zic că postarea în format text nu o să fie la fel în feed că ceea video. (Most likely o să fie o inspirata că în ceea de la IPS)

  • Like 2

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

"stefan just posted a new clip!" n-ar trebui sa fie pozitionata pe centru, nici intr-un sketch si cu atat mai mult intr-un proiect real pentru ca iti lasa foarte mult spatiu negativ fix acolo unde nu trebuie. "Online" si "Feed" eu le-as scrie exact asa, dar e subiectiva treaba, totusi ar trebui sa folosesti un alt font pentru ele si sa scazi putin din weight.

Tab-urile "content" si "about player" nu sunt foarte bine pozitionate odata pentru ca sunt greu accesibile userului si pentru ca ne putem imagina un scenariu in care ai mai mult de 2 tab-uri, spre exemplu 7, un numar random, va fi greu sa le oferi si spatiu necesar pentru toate si sa fie si responsive toata treaba.

Box-ul de la video are nevoie de un border-radius mai mic, adica trebuie sa fie constant, daca la sectiunea "online" ai 15px, la feed la fel, atunci si la box-ul pentru video trebuie sa ai la fel, aceeasi treaba si la tab-urile de sus, doar ca iti va fi greu sa le faci sa arate bine cu border-radius 15px unde sunt ele pozitionate.

Tot constant ar trebui sa fie si intreaga interfata si functii ce tin de UX, spre exemplu, ai pe profil un buton de follow si un buton de share, ambele ar trebui in momentul in care sunt actionate sa trimita o notificare fie user-ului ce le actioneaza, fie celuilalt, caz in care ai nevoie de un buton si o lista pentru notificari, adesea prezenta langa userlink.

Per total, n-ai muncit in zadar, imi place ceea ce vad, paleta de culori e interesanta si ca o concluzie, UI-ul e decent, exceptand micile probleme cu dimensionarea anumitor elemente sau pozitionarea lor gresita (titluri, avatarul din profil, etc.), UX-ul in schimb are cateva probleme mai mari pe care ti le-am enumerat mai sus, eu personal cand construiesc sketch-uri sau cand fac pagini propriu-zise, ma gandesc mereu "ba unde i-ar fi mai usor fiecarui user sa isi acceseze profilul?", chiar daca poate mie imi trece atunci prin cap "ba vreau sa-l pun in colt dreapta jos ca asa m-am trezit eu azi dimineata", pentru ca userilor le va fi greu sa il observe usor si va crea confuzie.

  • Thanks 1
Link to comment
Share on other sites

5 hours ago, Juliano Dillon said:

"stefan just posted a new clip!" n-ar trebui sa fie pozitionata pe centru, nici intr-un sketch si cu atat mai mult intr-un proiect real pentru ca iti lasa foarte mult spatiu negativ fix acolo unde nu trebuie. "Online" si "Feed" eu le-as scrie exact asa, dar e subiectiva treaba, totusi ar trebui sa folosesti un alt font pentru ele si sa scazi putin din weight.

Tab-urile "content" si "about player" nu sunt foarte bine pozitionate odata pentru ca sunt greu accesibile userului si pentru ca ne putem imagina un scenariu in care ai mai mult de 2 tab-uri, spre exemplu 7, un numar random, va fi greu sa le oferi si spatiu necesar pentru toate si sa fie si responsive toata treaba.

Box-ul de la video are nevoie de un border-radius mai mic, adica trebuie sa fie constant, daca la sectiunea "online" ai 15px, la feed la fel, atunci si la box-ul pentru video trebuie sa ai la fel, aceeasi treaba si la tab-urile de sus, doar ca iti va fi greu sa le faci sa arate bine cu border-radius 15px unde sunt ele pozitionate.

Tot constant ar trebui sa fie si intreaga interfata si functii ce tin de UX, spre exemplu, ai pe profil un buton de follow si un buton de share, ambele ar trebui in momentul in care sunt actionate sa trimita o notificare fie user-ului ce le actioneaza, fie celuilalt, caz in care ai nevoie de un buton si o lista pentru notificari, adesea prezenta langa userlink.

Per total, n-ai muncit in zadar, imi place ceea ce vad, paleta de culori e interesanta si ca o concluzie, UI-ul e decent, exceptand micile probleme cu dimensionarea anumitor elemente sau pozitionarea lor gresita (titluri, avatarul din profil, etc.), UX-ul in schimb are cateva probleme mai mari pe care ti le-am enumerat mai sus, eu personal cand construiesc sketch-uri sau cand fac pagini propriu-zise, ma gandesc mereu "ba unde i-ar fi mai usor fiecarui user sa isi acceseze profilul?", chiar daca poate mie imi trece atunci prin cap "ba vreau sa-l pun in colt dreapta jos ca asa m-am trezit eu azi dimineata", pentru ca userilor le va fi greu sa il observe usor si va crea confuzie.

Înțeleg acum, încă dețin probleme cu poziționarea și las mult spațiu pentru că mi se pare că ar arăta mai bine, am să relucrez interfața pe o înălțime mai mare a paginii pentru a putea arăta mai multe.

Momentan n-am mai făcut nimic însă o să revin peste câteva zile cu niște update-uri la site-ul meu. (gotta find a job 😁)

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

2N7Da35.png

În cazul în care nu se vede bine, puteți apăsa pe acest text să vă trimită la versiunea originală. (zoom în)

Este o temă de forum fiindcă mi-am readus aminte că acestea încă există. Nu știu dacă este ceva wow, după mine mi se pare una din cele mai reușite (după my previous works :D). Nu-mi dati bully pe subiectul "spațiului liber" de la widget mi-a fost lene (și în timp ce scriu asta îmi este somn), m-am apucat din plictiseală începând să fie un concept pentru landing page și a ajuns o temă. :))

Sunt conștient de faptul că "Category title" este puțin cam urâtel, încerc să o modific în ceva mai bun pe parcus. Încă mă gândesc dacă să o fac un real project cu cineva care este dispus să plătească.

Paleta de culori este una mov, 
Dark purple - #1f1c39
Purple - #524ab3
Black - #0f0e1c 

  • Like 1
  • Haha 1

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

  • gaby changed the title to Showcase websites: Spotify, Steam, etc.

8vAHVzQ.png

made it fiindca imi place munca celor de la [adult swim]. am incercat sa o tin simple and modern, parerile sunt la voi. multumesc pentru timpul fiecaruia care si-l depune sa ma ajute cu ajustari (chiar si cele minore 🤓).

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

7qUV1K7.png

Nimic special, doar un redesign la pagina personala cu proiectele adaugate acum, inca sunt de facut si am sa lucrez constant. Trebuia sa vina si pagina "despre mine" cat si niste idei pentru preview-ul proiectelor.

Facut in Next.js cu Tailwind CSS (recomand). Cat despre domeniu... inca ma gandesc la un nume pentru `.me` ;D

https://athos.vercel.app

  • Like 2

steam // anilist // spotify  
most of the time i spent listening to music and playing league.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.