#webdesign

8
39
#uxplakaljakuzywal

Kiedy produkt się rozrasta...

Interfejs Steama rozrastał się latami. I wiele lat jego elementy wyglądały tak, jak na załączonym obrazku: bez spójności wizualnej, z niezwykle skomplikowaną architekturą informacji, trudną w obsłudze dla nowicjuszy lub osób korzystających z niej rekreacyjnie.

Wydaje się, że na klątwę "spuchnięcia" i cierpiący na tym interfejs użytkownika cierpi wiele firm. Mają z tym problemy chociażby Amazon, WP i Reddit (do którego redesignu dalej się nie przyzwyczaiłam).

Steam w ostatnich latach zaczął nadrabiać zaległości. Wchodząc ostatnio na tę platformę, widzę znacznie mniej nieścisłości wizualnych, choć dalej zdecydowanie za długo szukam miejsca, gdzie mogę aktywować podarowany mi kod na grę.

Nie mamy stuprocentowej kontroli nad tym, czy produkt się rozrośnie, ani tym bardziej w którym kierunku. Ciężko jest się również na taki scenariusz przygotować (choć kusi zostawienie na zapas whitespace'u i potykacza "Under construction" w miejscach na planowane ficzery).

Nie powinno się natomiast dawać produktowi niekontrolowanie puchnąć, bo w końcu wszystko dąży do entropii. Nim się obejrzymy, w naszym mieszkaniu podłogę przykryje kurz, góry prania zaczną piętrzyć się na fotelu, a zlew zacznie żyć własnym życiem - i tak jest też z interfejsami.

I choć mało kto lubi robić gruntowne porządki, to raz na jakiś czas należy posprzątać nie tylko swoją szafę i folder "Pobrane", ale też interfejs aplikacji. Im dłużej z tym zwlekamy, tym trudniejsze zadanie czeka nas w przyszłości.

A skoro Steamowi się udało zabrać za porządki, to czemu nie Tobie? Posprzątaj dzisiaj chociażby folder "Pobrane" na komputerze.

#ux #design #webdesign #steam #valve
Wrzoo userbar
fe3a10fd-964a-488c-ab0d-09f2e2a03599
owczareknietrzymryjski

Sprzątnij folder pobrane zanim on sprzątnie ciebie

9bc96fb8-c429-4de3-9464-e404e457108a
AureliaNova

"Ile za ten projekt? No chyba cię pogięło, damy sobie w takim razie radę bez grafika, co to za problem jakiś button narysowac."

Tymczasem co-to-za-problem:


W ogóle to XD, że steam przy takich dochodach wygląda jak Internet Explorer twojego starego w 2010

macgajster

Ha! Nie używam pobranych i gardzę nimi. Wszystko trafia na pulpit, skąd szybciutko wędruje do kosza

Za to ostatnimi czasy jestem w połowie zapełnienia drugiej kolumny ikon na pulpicie i boli mnie to

Zaloguj się aby komentować

Temat wielokrotnie powtarzany, ale dziś się z nim zetknąłem i tego, kto projektował położenie przycisków należy powiesić. Z pewnością po wpisaniu danych najczęściej chcemy je wyczyścić.
#informatyka #webdesign #nieheheszki
bb2bcb73-0f80-4217-8c17-3d2fd89751d5
DKK

Przycisk wyczyść. Najbardziej bezsensowna rzecz stworzona przez ludzkość.

szybszylopez

@radziol A dodatkowo za to, że nr księgi jest w dwóch polach, (więc nie można łatwo skopiować) należy go wieszać powoli.

Amebcio

To jest cały współczesny trend. Nikt nie umie myśleć przy projektowniu interfejsu. Nikt nie umie myśleć przy budowaniu schematu sterowania w grach.


Nikt nawet nie stosuje dobrych praktyk w tych kwestiach

Zaloguj się aby komentować

Zostań Patronem Hejto i odblokuj dodatkowe korzyści tylko dla Patronów

  • Włączona możliwość zarabiania na swoich treściach
  • Całkowity brak reklam na każdym urządzeniu
  • Oznaczenie w postaci rogala , który świadczy o Twoim wsparciu
  • Wcześniejszy dostęp, do wybranych funkcji na Hejto
Zostań Patronem
Pamięta to ktoś jeszcze?

Stronka tak idiotyczna, że ludzie nie mogli przestać jej udostępniać - na dole miała prosty licznik odwiedzin, chyba do miliona, który kilka razy się resetował bo doszedł do limitu.

Była tak popularna, że przez wiele lat pozycjonowała się #1 w Google pod hasłem "węgiel drzewny".

http://www.patimex.com/

Żeby obejrzeć trzeba jakiś erzatz Flasha mieć, np.
https://addons.mozilla.org/en-US/firefox/addon/flash-player-emulator/

#heheszki #webdesign #glupoty #internet
dc40a0ca-9a8b-425e-8a7d-3239fd0bfb3d
SuperSzturmowiec

nie znałem ale gdzieś w albumie mam zjecie za gówniaka przy takich piecach do węgla drzewnego zrobione gdzie w "okolicach" Soliny. jakbym znalazł to wrzucę

Wrrr

@Opornik big bag big bag bugugugu

DexterFromLab

@Opornik nigdy nie widziałem tej stronki, ale węgiel nieraz kupowałem. Się z rodzinką jeździło na grilla nad rzekę albo jezioro i było fajen

Zaloguj się aby komentować

Pamięta ktoś adres tej stronki na której koleś zrobił parodię współczesnych stron www?
Mam na myśli wkurwianie userów tymi wszystkimi:
Zapisz się do newslettera!
Porozmawiaj z konsultantem!
Czy pozwalasz stronie wysyłać ci powiadomienia?
Akceptuj pliki kuki!
Poświęcisz krótką chwilę na wypełnienie ankiety?
Zobacz najnowsze promocje chuju!
Może jednak zapiszesz się do newslettera.
Załóż konto.

#frontend #webdesign #usability #wkurw
8e192913-73bf-4119-ab3d-d339744c2e4d
cec

Do tego wszystkie elementy strony bez żadnego kontrastu, oddzielenia wizualnego, zlewające się ze sobą.

Zwariowane fonty bez polskich znaków, żeby polskie litery jak najmocniej się wyróżniały.

Po wejściu na stronę wszystko schowane pod "hamburger menu", przez co jest on jedynym domyślnie widocznym elementem strony internetowej.

Gówniany krój czcionki, który jest kompletnie nieczytelny.

Aaaaa! I jeszcze te strony typu one page meaningless bullshit - jedna strona na której nie ma ani adresu firmy ani konkretów czym się zajmuje tylko jakieś pierdoły, że liczy się dla nich klient, spełniają jego najskrytsze oczekiwania i dbają o środowisko.

No i strony gdzie w nagłówku jest jebitne zdjęcie na cały ekran, które trzeba za każdym razem całe przewinąć, żeby dostać się do treści.

Albo strony ilustrowane obrazkami z dupy, kompletnie nie związanymi z treścią artykułu, a wstawionymi tylko dla atencji, bo debile jak widzą obrazek to częściej klikają.

No i strony seo z treścią wygenerowaną przez boty i translatory - za takie coś bym wieszał za jaja.

Zaloguj się aby komentować

Dobra mordko daj porade bo zawsze mi dobrze poradzisz,

Muszę postawić prostą stronę, menu gorne, 4 zakladki, 4 podstrony, jakis kontakt logo na gorze i chce tam wyswietlac zdjecia przedmiotow do sprzedania, żaden sklep tylko prezentowanie zdjęć i namiary na kontakt telefoniczny.

Co robisz w mojej sytuacji ? Chciałbym żeby to wyglądało jakoś przyzwoicie

Mam juz domene zaklepana, mam jakis hosting na hosting house ale ten quick cms to sobie mogę wsadzić

Jakis generator konkretny polecicie ?

#hosting #webdev #webdesign
Z kategorii ciekawostek: Zapraszam Cię do wehikułu czasu - jedziemy do lat 90. Takiego CSSika na pewno dawno nie widziałeś.
Swoją drogą, jeżeli macie jeszcze jakieś przykłady stron w takim stylu, śmiało wrzucajcie, z chęcią bym obejrzał

http://www.abc-med.info/index.htm

#webdesign #webdev #grafika #internet #ciekawostki
sierzant_armii_12_malp

@dundersztyc Do kitu ta strona. Nie ma licznika odwiedzin ani księgi gości


Z retro-stron kojarzę:


gawafe1241

@dundersztyc niby spoko ale dobrze że to minęło - strasznie oczojebne, nieco niespójne, za mało minimalizmu i jednolitości, tylko jakieś takie pstrokate...w takim MediCover wygląda to dużo lepiej, uporządkowane, łatwe w nawigacji https://www.medicover.pl/

jonas

Żarty żartami, ale to się ładuje w ujemnym czasie na dowolnej przeglądarce i sprzęcie nawet klasy "wooden PC".

Zaloguj się aby komentować

UI design kilku witryn internetowych by #midjourney

#aiart /tag/midjourney#grafika #webdesign
dab5a3c5-c4a1-4f18-9d6a-af4a4721e0ab
f6a40b95-f45d-47ea-b8a6-995a6e77742c
85c4fdfa-3ec7-461a-947b-03975cf5f916
098cddd9-b410-46a2-b19e-7a69b71ae2ec
b7dadd10-4dd3-499d-b95c-9d67a31ff66a
wombatDaiquiri

@dundersztyc 


by #midjourney


Ty jesteś autorem promptów?

wombatDaiquiri

@dundersztyc moim zdaniem powinno być "using #midjourney" bo jednak napisać takie wskazówki żeby się dobrze wygenerowało to też pewna sztuka

Zaloguj się aby komentować

Wiecie, że można już odmówić dostępu do swojej strony botowi od Chata gpt?

Jeżeli nie chcesz żeby Twoje treści służyły do szkolenia następnych wersji gpt można poprosić robota o wyjście.
Co ciekawe można im odmówić dostępu do nowych danych na stronie, ale nie można odmówić dostępu do tych które sobie wcześniej pobrali.

Przykładowy kod robots.txt
User-agent: GPTBot
Allow: /directory-1/
Disallow: /directory-2/

Robot przedstawia się jako
User agent token: GPTBot
Full user-agent string: Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; GPTBot/1.0; +https://openai.com/gptbot))

Dokumentacja:
https://platform.openai.com/docs/gptbot

#webdev #webdesign #hosting #chatgpt
entropy_ userbar

Zaloguj się aby komentować

Wy mówicie, że Hejto się nie rozwija? A oni suwak do zmiany motywu zaimplementowali.
#hejto #design #webdesign
61169141-c463-42e8-bf58-7e7782cd4a9d
Dzban3Waza

Myślę że w alternatywie masz paliwo za 7 złotych

Mikry_Mike

@MauveVn mała rzecz, a cieszy

Acrivec

@MauveVn Tylko że ten suwak jest od baaaaaardzo dawna. Tylko wcześniej był pod burger menu.

Zaloguj się aby komentować

Zaloguj się aby komentować

Hej, tym razem przychodzę z projektem aplikacji mobilnej
https://www.behance.net/gallery/164726627/Voyager-Traveling-App-Concept
STANDARDOWO LINK DO CAŁOŚCI
Dajcie znać co myślicie!
#ui #grafika #webdesign #aplikacja
0c2ea39d-4802-4d4b-8927-412b06366f70
DeadRabbit

Jako ktoś zajmujący się projektowaniem to problem z tymi conceptami apek to, że nigdy to nie będzie wyglądało jak autor zamierzył. Np. miasta zawsze będą zdjęciami, które firma będzie chciała wymieniać.


Ale jak już to tytuły miast i ofert po lewej. Cena powinna być jakoś wyróżniona jako osobny label najlepiej obok przycisku rezerwuj. serduszko powinno być do dodania do ulubionych. No i logo firmy powinno zawsze być widoczne na górze.

matihautamaki

@DeadRabbit dzięki za rady! wezmę je do siebie i wrócę jutro z poprawkami

SluchamPsaJakGra

@matihautamaki fajne, a ja bym od siebie dodał elementy systemu jak nawigacja czy pasek powiadomień. Tu aż tak ich brak nie przeszkadza ale czasem designer nie uwzględni jak ma się zachowywać np wspomniany pasek powiadomień. Czy ma być przezroczysty, jaki ma być kolor ikon itp

Zaloguj się aby komentować

#heheszki #architektura #webdesign
d104048e-64c3-4e51-8dc5-2aed216efcd6
kodyak

@tomasz-frankowski XD widzę że masz jeszcze spore problemy z łapaniem co napisałem, tak wiem że port jest wyparty ale to nie zmiania że całe komunikacja na innych jest oparta o ten właśnie konkretny wraz protokołem http, to że teraz dają HTTPS nie oznacza że coś się w tej materii zmienilo jeśli chodzi budowę internetu to dodanie tylko kolejnej warstwy bezpieczeństwa żeby to co działało na 80tce dalej działało,


Bądźmy poważni i nie róbmy osobistych wywodów "doucz się" tylko pisz od razu a nie że coś tam wiesz ale nie powiesz bo musiałbys jednak zerknąć czy nie naklamiesz

kodyak

@JanuszeBiznesu jakich fratasiXD ja tu backendas raczej i się śmieje z tego gówna przegladarkowego bo to kupa jest

Zaloguj się aby komentować

Hej, zacząłem dzisiaj Daily UI Challenge
Tak prezentuje się wykonany przeze mnie projeky Sign up page (Strony do rejstracji??)
STANDARDOWO LINK DO CAŁOŚĆI
https://www.behance.net/gallery/163573985/Sign-up-Page-%28Meditation%29
#grafika #webdesign #ui
a58e8ddd-14c2-4836-b13f-a204aa44df81
StarozytnyKosmita

Fajne. W czym się takie projektuje?

matihautamaki

@StarozytnyKosmita Ja używam Adobe XD, Photoshop i Illustratora, Jest też przeglądarkowy i DARMOWY odpowiednik czyli Figma, na yt masz multum poradników!

ujdzie

@matihautamaki ok, jest progres, możesz robić Daily. Jedyne co jest problemem to bardzo mały kontrast tekstu z tłem, zwłaszcza w etykietach formularzy.


Protip - olej XD, jest martwy, Figma jest teraz standardem w firmach. Możesz używać za free.

Zaloguj się aby komentować

Taki trochę #midjourney projektujący UI, z eksportem do Figmy. Jak bardzo jesteśmy w dupie? XD
#ux #ui #webdesign #webdev
cf2cecc8-2fee-4852-902e-11fdc8eee49f
MauveVn

@ujdzie Nie mam problemu z czymkolwiek, poza mitologizowaniem zawodu programisty jakoby był on równoznaczny z prosesją lekarza kardiochirurga, podczas, gdy to pospolity zawód, jak każdy inny.

ujdzie

@MauveVn jak widzę to robi AI to przestaję mieć problemy z mitologizowaniem tego zawodu, ale fakt - większość programistów nie ma żadnej odpowiedzialności i klepią sobie CRUD'y od rana do popołudnia.

rayros

Najwyżej skończy się tak że developer będzie pisał opisy do midjourney bo zleceniodawca nie będzie umiał:p

Zaloguj się aby komentować

Hej, przychodzę z kolejnym projektem! Uznałem, że będę teraz codziennie coś tworzył i dzielił się tym z wami
Tym razem padło na projekt graficzny strony internetowej!
Kawiarnia dla, której to zrobiłem nie istnieje, losowe logo ze stocka
CAŁOŚĆ POD TYM LINKIEM
https://www.behance.net/gallery/163502939/Coffee-Monster-Website
Chętnie poczytam wasze opinie!
#grafika #grafikakomputerowa #webdesign
c25bfcb5-1698-4795-90ae-fff099247366
matihautamaki

@ujdzie są 3 zakładki (opinie, zamów i kontakt) które właśnie kończę. jak wejdziemy na stronę mamy info o aktualnych promocjach, panel niżej dokładna lokalizacja kawiarni.

ujdzie

@matihautamaki dalej się nie rozumiemy, więc zapytam inaczej - jeżeli szukasz jakiejś informacji w google to oczekujesz, że dostaniesz stronę z właściwą odpowiedzią (czytaj: wartość biznesową), czy wrzucą się na stronę główną kawiarni i masz sobie szukać po podstronach? To są strony internetowe, masz tym ludziom dać informacje od razu LUB zachęcić ich do kliknięcia na odnośnik do nich, a ty masz ładne obrazki.


Mam wrażenie, że coś w stylu https://www.dailyui.co byłoby dla ciebie lepsze w nauce o co rzeczywiście chodzi w projektowaniu i przy okazji - budowaniu portfolio.


edit: ekipa od tailwinda ma też świetny ebook o projektowaniu https://www.refactoringui.com ale to dopiero jak zrobisz kilka daily ui

matihautamaki

@ujdzie dzięki bardzo za porady! ogarnę te podesłane przez ciebie linki

Zaloguj się aby komentować

Webmasterowe Tosie i Tomki, potrzebuję Waszej pomocy.
Co jakiś czas robię sobie zrzut całej strony internetowej do PDFa (czy to drukuj do PDF czy przez funkcję Opery "zapisz jako PDF"). Zawsze działało jednak natrafiłem na problem z zapisem gdy strona korzysta z jakiegoś diva (czy co tam obecnie jest używane, nie bijcie :D) przy użyciu "Overflow:scroll". Zapisuje mi stronę ale tylko z widoczny fragmentem tego diva a zamiast całości.
Jest jakiś sposób na to by zapisać całość do PDF? Robienie screenów i przewijanie jest dość mozolne gdy treści sporo
#webdev #webdesign #kiciochpyta
5tgbnhy6

sa extrnsiony/addony do przegladarek typu "whole page screenshot", pogooglaj

Whoresbane

@5tgbnhy6 Googlałem przed dodaniem wpisu i nie działały tak jak bym chciał. Nadal zapisują tylko widoczny wycinek overflowa zamiast całości

the_good_the_bad_the_ugly

@Whoresbane tu masz wyjaśnienie do czego służy ten atrybut: https://www.w3schools.com/css/css_overflow.asp


Jeśli nie zależy ci zbytnio na layoucie strony w tym PDF to po prostu wyciągnąłbym interesująca cię treść i ją zapisał. Ewentualnie spróbuj w tym atrybucie, w źródle strony zmienić „scroll” na „visible”. Nie będzie za pięknie ale cała treść powinna być dostępna dla konwertera. Chyba, że jest tu ktoś mądrzejszy ode mnie i zna lepszy sposób.

Zaloguj się aby komentować

#webdev #programowanie
Tworzę pierwszą stronę internetową od lat.
Taki biedny stan jest po 58 commitach i 4 dniach kodzenia xDD
Tak szczerze jestem w miare z tego zadowolony.
Najgorsza część przedemną: #webdesign żeby to nie wyglądało jak kupa gówna.
Ogółem sama strona to ma być "uzupełnienie do cv". Ma być takim dojebanym podsumowaniem moich projektów, edukacji, czy powodów dlaczego uważam że własnościowe oprogramowanie to praktycznie nazizm i dlaczego uważam Richarda Stallmana za najprzystojniejszego faceta na świecie, do tego pewnie będzie mirrorem do mojego serwera git, czy NAS-a gdybym potrzebował komuś coś przesłać.
Tym sposobem jeżeli tworzę cv pod ofertę dla programistów pythona, mogę w samym cv zamieścić 2-3 najważniejsze projekty, ale rekruter ma możliwość zapoznania się ze wszystkimi 40 które robiłem, lub zobaczyć moją kolekcje memów o papieżu ( ͡° ͜ʖ ͡°)
będę wdzięczny za poradniki jak tu dobrać jakieś kolory, czy zrobić kosmetyczne zmiany, żeby to nie odstraszało.
Spokojnie, nie zamierzam zabierać pracy frontend developerom ( ͡° ͜ʖ ͡°)
backend - data science here, może w przyszłości devops
3f630a1e-dc52-4d2e-8986-bea22dbbd59e
radler

@redve Kolory można dobrać z jakiegoś generatora, które dobierają pasujące odcienie. Na szybko - https://huemint.com/brand-3/# Fonty weź z google fonts. Dodaj jakiś tekst, i ładnie go sformatuj. Jeśli nie masz doświadczenia w tym to najlepiej uzyć dostępnych w sieci przykładów:

https://3.7designs.co/blog/10-examples-of-beautiful-css-typography-and-how-they-did-it/ (nr 4 (jest błąd w numeracji) tj. "Buzzworthy" wyglada całkiem nieźle)

666

@redve W bootstrapie nie musisz pisac js'a w ogole - samymi klasami w html robisz wyglad. Chyba ze cos wiecej niz wyglad robisz to wtedy juz frameworki jakies

redve

@radler wygląda ciekawie, dzięki

Zaloguj się aby komentować

Następna