Projekt nowego panelu klienta v3.0

LVL UP

SystemZ

SystemZ Admin lvlup.pro

Nie wiem czy zrobił to inny hosting w Polsce ale mam przyjemność zaprezentować frontend panelu klienta na licencji opensource, w tym wypadku jest to MIT

MIT to bardzo liberalna i przyjazna licencja zarówno dla developera jak i korzystających z kodu gdzie można nawet: ściągnąć, zmodyfikować kod oraz go sprzedawać, wystarczy tylko zaznaczyć autorstwo projektu.

690x388

Obecną zbudowaną wersję można obejrzeć na http://demo.lvlup.pro Polecam zawsze użyć Ctrl + F5 aby wczytać najnowszą wersję. Aktualizacja kodu jest co dzień lub kilka.

Cały kod można znaleźć na GitHub: https://github.com/lvlup-pro/spawn-frontend

Z chęcią wysłucham opinii odnośnie wyglądu.

Jest sporo błędów i generalnie to nawet nie jest jeszcze czas na ich zgłaszanie, bardziej chodzi mi o to czy podoba wam się kierunek w którym to podąża, szybkość na urządzeniach mobilnych oraz kolorystyka.

Przez jakiś ostatni rok lub więcej planowałem znalezienie i użycie elementów które będą bardzo szybkie gdyż powolność strony to moim zdaniem jeden z najbardziej irytujących czynników. Wygląda na to że wreszcie udało mi się znaleźć elementy które spełniają moje wymagania i skleić je w całość. Póki co nie jest tu używane nawet jQuery co czyni rozwiązanie lekkim.

Kukubaczek

Kukubaczek

Jak na razie prezentuje się swietnie ;) Dla pewności: będzie możliwość wielu użytkowników oraz maszyn?

PS: A co w tej sytuacji z AimPanel? To ma go zastąpić?

SystemZ

SystemZ Admin lvlup.pro

To zupełnie inna rzecz niż Aimpanel i panel klienta go nie zastąpi. W panelu klienta są płatności, zgłoszenia itp. Aimpanel to projekt panelu hostingowego do gier i ten nowy panel klienta będzie miał z nim integrację.

Innymi słowy Aimpanel to wydzielona część panelu klienta do obsługi serwerów gier.

Mam nadzieję że teraz rozumiesz już jak to będzie działać.

happi

happi

Rozciągnąłbym buttony i zrobił coś na styl flat.

SystemZ

SystemZ Admin lvlup.pro

Możesz rozwinąć? Mi się obecnie wydają płaskie. Mają małe zaokrąglenie.

Szymon

Szymon

chyba chodzi oto, aby były na całą szerokość tego paska po lewej stronie.

SystemZ

SystemZ Admin lvlup.pro

A, chodzi o menu. Sądziłem że chodzi o zielone przyciski przy zmianie hasła, następnym kroku zamówienia itp.

Kombinowałem już z tym wcześniej ale usuwając padding dziwnie to wygląda, jest za mała separacja między krawędzią przeglądarki jak dla mnie. Sami zobaczcie jak się to prezentuje przy systemowym pasku po lewej.

389x390

Próbowałem też dać trochę margin dla pozycji w menu (patrz "Nowości")

392x302

Ale to raczej nadal nie wygląda super. Chyba że ktoś ma inny pomysł jak to rozwiązać? Może być kod CSS wklejony na forum, przyjmę też chętnie pull requesty na GH :slight_smile:

Szymon

Szymon

U mnie wygląda to tak: http://screenshot.sh/mMiRZmvctD5AT Nie wiem czy mu chodziło o to czy może co innego. Nie jest chyba najgorzej z ta przerwą.

Ymies

Ymies

Moim zdaniem Pomoc jest mało przejrzysta strasznie odtrąca.

koweq

koweq

Szczerze? Nie podoba mi się :(. Mnie ten design odpycha.... Mam nadzieje że jeśli to wprowadzicie to będzie można przeskoczyć do terazniejszego wyglądu.

SystemZ

SystemZ Admin lvlup.pro

Ymies:

Moim zdaniem Pomoc jest mało przejrzysta strasznie odtrąca.

Który element to powoduje? Było za dużo podstron z pomocą więc teraz będzie tylko ta jedna. Łatwiej w nawigacji jak dla mnie.

koweq:

Szczerze? Nie podoba mi się :(. Mnie ten design odpycha.... Mam nadzieje że jeśli to wprowadzicie to będzie można przeskoczyć do terazniejszego wyglądu.

Przez jakiś czas będzie dostępny zarówno nowy jak i stary panel. Potem stary zostanie usunięty. Nie dam rady wspierać dwóch zupełnie innych rozwiązań technicznych za długo. Co dokładnie jest złego w tym wyglądzie? Chodzi o układ czy kolorystykę? Wskaż co poprawić :slight_smile:

patryks

patryks Pionier

Nwm czy to jest w planch, czy nie, ale ja bym dodał hover na te przyciski po lewej z lekko jaśniejszym kolorem, coś jak przy tych zielonych 😉

SystemZ

SystemZ Admin lvlup.pro

Dobry pomysł, faktycznie to przeoczyłem. Będzie styl na najechaniu :slight_smile:

happi

happi

http://prntscr.com/bcjetx Chodziło mi o rozszerzenie do krawędzi i usunięcie obramowania. Możesz jeszcze zrobić większy odstęp by się lepiej prezentowało.

koweq

koweq

Chociaż... Na telefonie to fajniej wygląda niż na komputerze... Jest OK- 6/10 ;)

adminek153

adminek153 Moderator forum.lvlup.pro

Moja ocena tego panelu jest następująca - 5/10.

W obecnym zastosowaniu menu tzw. pasek boczny/pasek zadań jest za mały. Jednakże po moich próbach/testach tego pasku większy ma dużo mniej zastosowań, a wygląda średnio.
Z początku myślałem, że obecny panel jest łatwy, ten jest dużo łatwiejszy, wszystko dość przejrzyście opisane.
Wygląd bardzo naturalny- neutralny. Podstawa.
Na telefonie wygląda 2 razy lepiej niż na komputerze.
Nie przemawia przez mnie ten panel do końca..

Tutaj jest lekka moja propozycja: 690x270 Chodzi mi głównie o samo menu - jak dla mnie lepiej się prezentuje niż to z propozycji.

377x500 - Mój panel 2 razy większy.

Po za tym reszta jak na razie prezentuje się całkiem nie źle...

SystemZ

SystemZ Admin lvlup.pro

Dzięki za wskazanie co jest źle :slight_smile:

Jak sądzicie, tak byłoby lepiej? Mam już kod ale nie wrzucałem jeszcze na serwer. Czekam na opinie. Według mnie faktycznie chyba te małe menu psuło cały efekt. Teraz wygląda lepiej.

690x388

Popracuję jeszcze nad podświetleniem menu przy najechaniu oraz wstawieniem loga zamiast tekstu na górze.

koweq

koweq

Teraz jest spoko :)

adminek153

adminek153 Moderator forum.lvlup.pro

Teraz jest dużo lepiej :)

Libter

Libter Developer

Dokonałem kilku zmian i utworzyłem propozycję na GitHubie: https://github.com/lvlup-pro/spawn-frontend/pull/1

Panel po uwzględnieniu proponowanych zmian wygląda tak: https://cloud.githubusercontent.com/assets/5753763/15806285/6d1d3be6-2b40-11e6-82ea-f3774bdc6aa5.png

Co o tym sądzicie:

czy nowe menu jest lepsze czy może lepiej zostawić menu przedstawione tutaj?
czy coś jeszcze wymaga zmiany?

SystemZ:

Popracuję jeszcze nad podświetleniem menu przy najechaniu oraz wstawieniem loga zamiast tekstu na górze. Gotowe :)

adminek153

adminek153 Moderator forum.lvlup.pro

@Libter lepiej wygląda to wyżej by SystemZ- uwzględnienie kształtu musi być tutaj ważne. Ale ładnie dopasowałeś logo - plus dla Ciebie :)

Oczywiście to tylko moja opinia

happi

happi

Wolałbym coś szczerze w stylu defaultowej strony tak jak pokazywałeś we wcześniejszym temacie.

adminek153

adminek153 Moderator forum.lvlup.pro

Taki kolejny pomysł wszedł mi do głowy, mianowicie pokazanie aktywnej zakładki (tak mniej więcej jak pokazałem w Moim szkicu) - tego mi brakuje w tym projekcie na stronie demo.

690x102 Warto by przemyśleć czy ten fragment jest potrzebny do zgłoszenia... Pomysł jakiś to jest, lecz pewnie 40% zgłoszeń dotyczy zamówień, błędów czy sugestii i nie będzie to potrzebne do wypełnienia. Można dodać to może jako opcjonalne do wypełnienia?

Ponadto może fajnie by było [mowa tutaj również o systemie ticketów] zintegrować ten system z forum - myślę tutaj o informacji, którą może zwracać system. Tak jak wygląda to na forum: 690x139 Może to mogło by pomóc zarówno stronie odpowiadającej na zgłoszenia jak i je piszące :slight_smile:

Trochę drętwo wygląda zakładka "dostęp" nie wiem dlaczego odpowiednik tego w wersji 2.9.9 bardziej mi się podoba... Może to z powodu aż tak olbrzymiego dośrodkowania... Nie potrafię tego opisać spróbuje to jakoś w tym tygodniu zobrazować..

SystemZ

SystemZ Admin lvlup.pro

adminek153:

Taki kolejny pomysł wszedł mi do głowy, mianowicie pokazanie aktywnej zakładki (tak mniej więcej jak pokazałem w Moim szkicu) - tego mi brakuje w tym projekcie na stronie demo.

Prace w toku :slight_smile:

https://github.com/lvlup-pro/spawn-frontend/issues/11

adminek153:

Warto by przemyśleć czy ten fragment jest potrzebny do zgłoszenia... Pomysł jakiś to jest, lecz pewnie 40% zgłoszeń dotyczy zamówień, błędów czy sugestii i nie będzie to potrzebne do wypełnienia. Można dodać to może jako opcjonalne do wypełnienia?

Te pole to nowość i musi być wymagane. Cała zaleta polega na tym że jest wymagane.

Podpatrzyłem to w innym systemie zgłoszeń, pozwala to obsłudze działać szybciej. Przykładowo czasami chcę się dopytać dla pewności czego dokładnie oczekuje klient aby nie było niedomówień, czasami ta wymiana wiadomości to trwa i 3dni a na końcu się okazuje że dobrze się domyślałem czego potrzebuje klient i zbędnie czekał. Jeśli zaznaczy "zrób to za mnie" pozwala mi to szybciej zrealizować całe zadanie. Dla "wiem wszystko" nie będę zbędnie tłumaczył zagadnienia klientowi który wie o co chodzi i też zaoszczędzimy wszyscy czas.

Sądzę że większość ticketów będzie szybciej obsłużonych dzięki temu. Tyle w teorii, trzeba spróbować i zobaczyć czy się sprawdzi, innej drogi nie ma :slight_smile:

adminek153:

Ponadto może fajnie by było [mowa tutaj również o systemie ticketów] zintegrować ten system z forum - myślę tutaj o informacji, którą może zwracać system. Tak jak wygląda to na forum:

Integracja ticketów z forum była w mojej głowie podczas gdy tworzyłem forum, można nawet powiedzieć że po to powstało forum 😈 Zdecydowanie się to pojawi.

Na http://demo.lvlup.pro można obecnie zobaczyć wersję v0.6.0 Dzięki @Libter za wprowadzone poprawki :slight_smile:

SystemZ

SystemZ Admin lvlup.pro

A post was split to a new topic: Zmiana linku w przeglądarce bez przeładowania

adminek153

adminek153 Moderator forum.lvlup.pro

Jak postępy? :) Coś troszeczkę pustko i chciałem tak zapytać ^^ czy projekt jest kontynuowany?

SystemZ

SystemZ Admin lvlup.pro

Aktualnie pracuje nad backendem czyli drugą stroną panelu klienta to co będzie na serwerze, niestety tu nie planuję póki co udostępniać kodu źródłowego a aktualnego postępu nie mam jeszcze niestety jak pokazać. Przez ostatnie miesiące testowałem różne technologie i w końcu wróciłem do punktu wyjścia :P

anon10657637

anon10657637

SystemZ:

Przez ostatnie miesiące testowałem różne technologie i w końcu wróciłem do punktu wyjścia

a np. jakie? 😃

SystemZ

SystemZ Admin lvlup.pro

Biblioteki, frameworki i sposoby implementacji mikrousług. Doszedłem do wniosku że taka architektura nie jest odpowiednia do tej skali, powoduje więcej problemów niż pożytku i zostanę przy zwykłym REST API + workery, tyle że mocno rozdzielone tak aby łatwo było je ewentualnie zastąpić.

anon82750602

anon82750602

Ja próbowałem coś z designem, chciałem kolorowy pasek na górze ale z logo nie współgra ;/

Ale coś pokombinuje :)

SystemZ

SystemZ Admin lvlup.pro

Zapodaj screena, łatwiej będzie ocenić czy warto pakować się w jakieś większe zmiany :slight_smile:

anon82750602

anon82750602

Odkopałem i wygląda to tak:

https://puu.sh/sIbEY/30ea230151.png

Szymon

Szymon

Szczerze? Nie jestem za twoim wyglądem gabix :/

Karolek

Karolek

Ogólnie ten wyglad to taki z dupy ✌️

koweq

koweq

Wygląd jest po prostu brzydki.

patryks

patryks Pionier

Mi ten gradient się strasznie nie podoba, do reszty nie mam za wielkich zastrzeżeń :P

anon82750602

anon82750602

Chciałem ten gradient u góry, jednak gdy wstawiłem logo - wygląda to źle ;/

Aktualnie wygląda to tak, dużo lepiej, ale nadal źle 😛

https://puu.sh/sJUIZ/a7e9805310.png

adminek153

adminek153 Moderator forum.lvlup.pro

Dalej jest nie do końca dobrze 😛, mógłbyś może przedłużyć pasek do końca strony, może lepiej by to wyglądało.

anon82750602

anon82750602

Wiem, właśnie chce to zrobić ;v

Karolek

Karolek

Moim zdaniem kolory nie pasują do siebie i tyle.

koweq

koweq

Jak tam prace nad panelem? Demo.lvlup.pro nadal aktualizowane?

P.S jeśli tak to postaram się przygotować moją propozycję. Może gdzieś w weekend ją udostępnie.

SystemZ

SystemZ Admin lvlup.pro

Póki co robię backend czyli niestety nic co mogę pokazać wizualnie.

Nieznajomy11

Nieznajomy11 Moderator forum.lvlup.pro

Proponuję dodanie ciasteczka które odpowiadałoby za zapisanie ostatnio otwartej karty, tak aby nie trzeba było mając głównie VPS za każdym razem zmieniać z MC. :slight_smile:

SystemZ

SystemZ Admin lvlup.pro

W nowym panelu nie ma w ogóle cookies jako takich konstrukcyjnie (co najwyżej do statystyk). Wszystko jest oparte o local storage.

Co do samej funkcji o ile Cię zrozumiałem to wydaje się zbędna, może wprowadzać niepotrzebne zamieszanie. Proponuję dodać stronę do zakładek lub ją przypiąć jak to jest możliwe np. w Chrome. Sama lista usług będzie jedna, to powinno też rozwiązać problem z koniecznością przełączania list.

Nieznajomy11

Nieznajomy11 Moderator forum.lvlup.pro

Proponuje w nowym panelu wyświetlanie, gdy nie ma wolnych VPS, kiedy wygasa najbliżej i jeśli zostanie nieopłacony to, że będzie można zamówić.

adminek153

adminek153 Moderator forum.lvlup.pro

Również podczepiam się pod sugestię @Nieznajomy11, fajnie by było kiedy panel informowałby kiedy jest możliwość zakupu nowej usługi kiedy aktualnie jest nie dostępna.

happi

happi

http://imgur.com/a/dXFv1 Moja propozycja.

Wygląd forum jest ładny, dlaczego by tego nie przenieść do panelu? ^^ Radzę przeglądać przez imgura, bo białe tła się będą gryźć. :<

(tak, wiem, że te boxy z serwerami są brzydkie xD)

anon82750602

anon82750602

Kod mojego wyglądu frontendu jest dostępny tutaj: https://github.com/gabixdev/spawn-frontend

Nie chciało mi się już łączyć z commitami Libtera, może skorzystacie ;)

koweq

koweq

Ponieważ nic nie udało mi się przygotować to tylko coś zaproponuje:

Może kiedy klika się w ten przycisk po boku to będzie ten efekt "fali" tak jak na status.lvlup.pro
Druga propozycja jest taka by lista opcji (np. przy wyborze usługi do kupienia) lista się rozwijała a nie tak po prostu się pojawiała i znikała?
w wersji telefonowej "profilowe" pokazuje się obok loga LVLUP i psuje efekt. Niech "profilowe" w wersji telefonowej będzie pod logiem.

SystemZ

SystemZ Admin lvlup.pro

@happi Discourse wygląda spoko ale nie wiem czy spisałoby się w panelu. Trochę inny content jednak. Twój projekt wygląda fajnie, muszę jeszcze nad tym pomyśleć, nie chciałbym jednak aby użytkownicy mogli pomylić zawartość publiczną z prywatną, bo taki sam wygląd może do tego prowadzić a różnica powinna być zdecydowanie bardziej widoczna.

@anon82750602 wybacz ale się strasznie rozjeżdża po odpaleniu z commitem 734a255c976f1da6a1e9847aa3c5b732ff957de4, to nie jest to czego szukałem

690x391

anon82750602

anon82750602

@koweq myślisz o tym aby przerobić na material design?

koweq

koweq

To byłby dobry pomysł