Gdzie mogę znaleźć inspirację dla dobrego interfejsu użytkownika? [Zamknięte]


18

Mam problem mentalny w zakresie projektowania interfejsu głównego ekranu dla aplikacji komputerowej, którą obecnie aktualizuję. Kiedy pierwszy raz opracowałem ten program, rozdzielczość ekranu wynosiła 640 X 480. Obecnie istnieje wiele rozdzielczości ekranu.

Gdzie mogę znaleźć pomysły na dobry układ ekranu głównego dla aplikacji komputerowej?


1
Co to za aplikacja? PhotoShop / GIMP / imagey, Eclipse / VS / codey, Maya / 3DStudio / Cad: y?
Macke,

Aplikacja finansów osobistych, dane przechowywane w zastrzeżonej bazie danych.
Michael Riley - AKA Gunny,

7
Wymiana doświadczeń użytkowników - nie jest to odpowiedź, ale ponieważ jesteś w trakcie przeprojektowywania interfejsu użytkownika, pomyślałeś, że będzie to dla ciebie interesujące.
yannis,


1
@Yannis - Dziękuję ... Całkowicie się zgubiłem (i dokąd to prowadzi) tak wczoraj.
Michael Riley - AKA Gunny

Odpowiedzi:


6

Polecam sprawdzenie kilku różnych książek, które, o dziwo, nie koncentrują się na projektowaniu GUI aplikacji komputerowych. Niezależnie od tego, te teksty pomogą ci zacząć myśleć o tym, jak uzyskać informacje, których potrzebują użytkownicy w formie, którą rozumieją ich mózgi. W każdym razie pierwszą książką jest The Non-Designer's Design Book autorstwa Robina Williamsa. Ta książka nauczy Cię o kompozycji w kategoriach nie tak graficznych. Ta książka sprawi, że zaczniesz myśleć o tym, jak ludzki umysł postrzega elementy projektu.

Po drugie, sprawdź Don't Make Me Think autorstwa Steve Krug. Zajmuje się nawigacją i reprezentacją danych na stronach internetowych, ale wiele z rekomendacji (np. Nawigacja w bułce tartej) często ma taki sam sens w aplikacjach komputerowych jak na stronach internetowych.

Jak wskazał inny plakat, dobre wzorce projektowe nie istnieją w izolacji na medium. Niektóre rzeczy nie tłumaczą się tak dobrze między analogowym a cyfrowym (np. Tekst w wielu kolumnach w rzeczywistej gazecie w porównaniu do aplikacji dla gazety), ponieważ pewne ograniczenia są różne w zależności od medium, ale wiele zasad dobrego projektowania jest prawdziwe bez względu na wszystko medium, o którym mówisz.



5

Jedna wskazówka, którą często słyszałem, to inspirowanie się projektami, które lubisz. Nie jest to odosobnione, by po prostu powiedzieć, aplikacje komputerowe, ale powinno obejmować sztukę, architekturę, sieć, fotografię, produkty itp.

Pomoże Ci to zbudować poczucie tego, czym jest dobry projekt i pomoże ci w długoterminowych aplikacjach projektowych, które są miłe dla oka i przyjazne dla użytkownika.

Jeśli prototypujesz swój projekt, możesz uzyskać pomoc od użytkowników lub innych programistów, aby spróbować go podczas zbierania opinii. Nie tylko co mówią, ale co robią. (przykład: ludzie mówią, że nie lubią zaśmieconych wysp w Walmart, ale dosłownie stracili ponad 1 miliard dolarów sprzedaży, kiedy usunęliście bałagan)


3
+1 za prototypowanie. Zamiast skupiać się na „1 najlepszym pomyśle!”, Wygeneruj całą ich grupę. Następnie pokaż swoje prototypowe pomysły grupie ludzi. Otrzymasz wiele opinii i możesz ulepszyć swój projekt.
Stephen Gross

[Walmart] dosłownie stracił ponad 1 miliard dolarów sprzedaży, gdy usunęli bałagan; cytat?
funkybro 21.11.11



1

Zawsze przestrzegam zasady minimalizacji kliknięć i naciśnięć klawiszy. Nie jestem zbyt dobry w tworzeniu seksownie wyglądającego interfejsu użytkownika, z dużą ilością kolorów i pulchnymi przyciskami, ale użytkownicy mówią, że moje interfejsy są proste w użyciu. Tu jest jeden.

Odkryłem, że użytkownicy uwielbiają natychmiastową reakcję . To jest jak w Hollywood. Ludzie kochają piksele (najlepiej kolorowe piksele). Naprawdę uwielbiają poruszające się piksele .

Próbując stworzyć takie interfejsy użytkownika i uprościć kodowanie, wiele lat temu wymyśliłem schemat, którego wciąż używam do dziś - Differential Execution . (Nie mogę powiedzieć, że miałem dużo szczęścia, kiedy to opublikowałem, ale oto jest. Zostało opublikowane, FWIW.)

To tylko moje dwa centy.


Twoja strona wiki została usunięta. Czy to gdziekolwiek indziej?
Michael Riley - AKA Gunny

@Cape: Tak, zostałem odcięty na kolanach - coś o neologizmie . Cokolwiek. Znacznik SO „różnicowe wykonanie” wymaga ode mnie objaśnienia i umieściłem implementację na sourceforge. Są też publikacje, z których ostatnią chętnie prześlemy, jeśli potrzebujesz czegoś oszałamiającego. Może bardziej chodzi o aplikację aukcyjną, którą zrobiłem kilka lat temu, którą mogę spakować do ciebie. Jest w VC6 (MFC), ale nie jest duży i działa dobrze.
Mike Dunlavey,

@Cape: W rzeczywistości moja strona użytkownika Wikipedii wciąż ją ma, ale kiedy na nią patrzę, nie jest zbyt dobra.
Mike Dunlavey,

Jedną z rzeczy, które należy wziąć pod uwagę przy minimalizacji kliknięć i naciśnięć klawiszy, jest koszt każdego kliknięcia podczas myślenia. Ludzie zazwyczaj wolą wykonywać kilka kliknięć, które są prawie bezmyślne, niż takie, które należy wziąć pod uwagę. Oczywiście mniej mniej bezmyślnych kliknięć jest lepszych niż kilka bezmyślnych kliknięć. Zasada ta została omówiona nieco w temacie Nie każ mi myśleć .
whatsisname

@whatsisname: Dzięki za wgląd. Staram się stworzyć „ścieżkę najmniejszego oporu”, czego ludzie najbardziej chcieliby. Jednak nie zawsze może to zrobić.
Mike Dunlavey,

1

Myślę, że pierwszym krokiem jest określenie stylu / motywu. Na przykład styl Windows 8 Metro vs. NT.

Kilka sugestii dotyczących zasobów i inspiracji (wspominam o WPF / Web, ale nie musisz go oczywiście używać):

Odp .: Jeśli chcesz zacząć od prototypowania, style kontroli tutaj są fajnymi stylami i kontrolkami kontroli sieci

B - Component Factory zapewnia dobre uniesienie twarzy - oferują nawet jeden darmowy produkt w: Component Factory

C - Zewnętrzni twórcy kontrolek GUI mają dobrze wyglądające dema

D - Spróbuj wyszukać słowo „książki” na tej stronie: User Experience - Otrzymasz mnóstwo postów.

E- Ta aplikacja WPF : Aplikacja WPF Health Care

F - Ta aplikacja WPF: Billy Holis - WPF i gotowa wersja na: WPF - StaffLynx

G - Narzędzia w stylu Metro są dostępne, jeśli chcesz. Sprawdź to: styl Metro

Co najważniejsze, jak już zapewne wiesz, zrównoważ wysiłek z wartością.

Edytować

DevXpress wydał nową wersję obsługującą Metro Style, właśnie obejrzał wideo z obecnym DevXpress-2


1
Link do aplikacji E - WPF-Health Care jest zerwany.
Michael Riley - AKA Gunny

@CapeCodGunny, dzięki za notatkę, teraz powinno być OK :)
NoChance 22.11.11

0

Nie mogę wystarczająco polecić książki Edwarda Tufte'a Wizualne wyświetlanie informacji ilościowych . Naprawdę sprawia, że ​​myślisz o tym, co prezentujesz i dlaczego. Wszystkie jego książki są dobre, ale najbardziej odnoszę się do tej książki.

Dobra książka „Wzorzec projektowania interfejsu użytkownika”, którą znalazłem, to Projektowanie interfejsów . Zawiera sekcje dotyczące projektowania układów, nawigacji, wyświetlania złożonych informacji i projektowania formularzy wejściowych. Istnieje podobna książka na temat projektowania interfejsów społecznościowych (zwana, odpowiednio, Projektowanie interfejsów społecznościowych ), ale jej nie przeczytałam, więc nie wiem wystarczająco, żeby ją polecić.


Jaka jest jedna z najbardziej przydatnych rzeczy odkrytych w książce Tufte? Jak to zmieniło twoje myślenie?
Michael Riley - AKA Gunny

Czy naprawdę uważasz, że jest to dobra książka dla początkującego, która wymyśli prosty projekt interfejsu użytkownika? Ja nie. Jest to cenna książka, ale to trochę tak, jakby sugerować, że dowiedzą się o otwarciu restauracji, kiedy wszystko, co chcą zrobić, to upiec porcję ciasteczek.
Bryan Oakley

@CapeCodGunny: Rzeczy, które naprawdę mi się przydają, to dekonstrukcja typowych stylów prezentacji, redukująca je do najniezbędniejszych elementów (rozdz. 6) i sekcja na temat „integralności graficznej”.
TMN

@BryanOakley: Powiedział, że po raz pierwszy zaprojektował ekran o rozdzielczości 640x480, która musi być kilka lat temu, więc wątpię, że jest początkujący. I nie dał żadnych wskazówek, że interfejs użytkownika jest prosty (lub że nie był). Właśnie opowiadałem o niektórych zasobach, które pomogły mi, kiedy zacząłem naprawdę projektować interfejsy użytkownika, zamiast po prostu naklejać na ekranie kilka pól tekstowych i etykiet.
TMN

@Bryan - Mój produkt ma 20 lat, przeszedł z DOS na Windows. Nadal się sprzedaje, ale jest przestarzały.
Michael Riley - AKA Gunny

0

Jest już kilka dobrych książek, które zostały już polecone. Witryna wymiany stosów UX jest lepiej przygotowana do obsługi takich pytań, ale nie jest też całkowicie nie na temat.

Przede wszystkim mediaqueri.es to świetny zasób na Twój konkretny problem, ponieważ jest to galeria stron internetowych i aplikacji internetowych, które są odpowiednio zaprojektowane, aby pasowały do ​​różnych rozdzielczości ekranu i programów użytkownika.

mediaqueri.es

Sprawdź także w Smashing Magazine . To blog, który jest prawdziwym rajem dla programistów, zawierający posty dotyczące UX / UI, HTML / CSS / JavaScript, projektowania graficznego i projektowania stron internetowych. Mają także posty, które badają określone strony internetowe i kampanie marketingowe i widzą, co zrobili dobrze (i źle) z decyzjami UI / UX. Regularnie sprawdzaj tę witrynę, aby uzyskać codzienne porady dotyczące tych tematów.

Potem, gdy zaczniesz czerpać inspirację, spójrz na niektóre pytania SO / SE, w których specjalnie zagrałem na ten temat. Są to tylko ogólne zasoby dla każdego, a nie tylko OP:

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.