Przezwyciężanie ogólnego braku umiejętności projektowania interfejsu użytkownika u programistów [zamknięte]

17

Powiedziano mi i przekonałem się, że wielu programistów nie jest dobre w projektowaniu interfejsu użytkownika (nie wiem, jak to jest prawdziwe), ale przynajmniej dotyczy mnie .

W tworzeniu stron internetowych dobre umiejętności programowania nie są wystarczające bez wielkich umiejętności projektowania interfejsu użytkownika.

Więc dla mnie i wielu programistów takich jak ja, którzy mają tylko połowę rzeczy (dobre umiejętności programistyczne), jak powinniśmy zakończyć naszą drugą połowę poza płaceniem za projektanta?

Czy używanie szablonów internetowych Open Source z niewielkimi modyfikacjami jest najlepszym rozwiązaniem w tym zakresie, czy też istnieją inne opcje?

Ali
źródło
12
„Jako osoba korzystająca z UX o słabych umiejętnościach programistycznych, jak mam stworzyć witrynę bez płacenia programistom?”
Steven Evers,
Powinieneś zobaczyć, nad czym teraz pracuję - katastrofa interfejsu użytkownika. Nie sądzę, aby ktokolwiek pracujący nad projektem kiedykolwiek przeglądał przewodniki projektowania interfejsu użytkownika. To samo dotyczy mojego poprzedniego projektu, tylko w tym przypadku wymusiłem problem i zaangażowałem się w projektanta graficznego, ale niektóre elementy kodu były poza moją kontrolą, które były naprawdę okropne.
Skizz
7
Zatrudnij projektanta. To jedyny sposób, aby się upewnić.
SF.
1
To pytanie jest problematyczne. Równie dobrze możesz porozmawiać o przezwyciężeniu ogólnego braku umiejętności programowania u projektantów.
Alex Feinman,

Odpowiedzi:

11

Jestem programistą, który również nie jest tak świetny w projektowaniu. Dokładam wszelkich starań, aby pracować nad projektem, w którym muszę projektować, aby wszystko było jak najprostsze. Podchodzę bardzo logicznie i projektuję wyłącznie pod kątem wygody użytkownika. Nie mogę sprawić, aby wyglądał naprawdę pięknie, ale mogę sprawić, że będzie przyjazny dla użytkownika i stosunkowo przyjemny dla oka.

Przeczytałem kilka z tych książek: http://www.uxbydesign.org/2009/06/24/20-user-experience-books-you-should-own/ i naprawdę mi pomogły.

edytować mój ulubiony z tej listy to Don't Make Me Think: Common Sense Approach to Web Usability, 2nd Edition Steve Krug

Sydenam
źródło
Nie wiem, dlaczego programiści uważają, że muszą być wszystkim dla wszystkich przez cały czas. Jestem już programistą, projektantem, architektem, analitykiem biznesowym, wsparciem produkcji i kontrolą jakości. To wciąż za mało i muszę być teraz DBA.
wałek klonowy
3
Jako freelancer musisz sam posiadać wszystkie umiejętności lub zostać zmuszony do outsourcingu części projektu. Jeśli nie jesteś w stanie nic zrobić, szkoda, że ​​musisz znaleźć kogoś innego. Ale jeśli możesz nauczyć się tych umiejętności, dlaczego nie, i zdobądź więcej i stań się bardziej atrakcyjnym deweloperem z perspektywy potencjalnych klientów.
Sydenam
2
Wiem i zgadzam się z tobą, jestem po prostu zniesmaczony tym, czym staje się branża. Otaczają mnie ludzie, którzy nienawidzą swojej pracy i są przepracowani, i mam głupi pomysł, że mają nadzieję, że będą kolejnymi Angry Birds i pytają mnie, czy mogą zapłacić jednego Indianina 6 USD za godzinę, aby wykonać CAŁĄ PRACĘ i po prostu otworzyć źródło wszystkiego bez udziału, ponieważ open source jest przecież DARMOWY. Potem mają nadzieję zarobić miliony i porzucić pracę. Ci, którzy mają złe pomysły, oczekują coraz więcej, a nawet więcej za prawie brak pieniędzy. Po prostu robi mi się niedobrze.
wałek klonowy
5

Projektowanie (czegokolwiek) jest negocjacją między potrzebami różnych interesariuszy (klienta, programisty, użytkowników). Żaden z interesariuszy zazwyczaj nie jest w stanie stworzyć najlepszego projektu, ponieważ zazwyczaj najlepiej rozumieją własne potrzeby i stawiają je ponad potrzebami innych interesariuszy. Dobry projektant może zidentyfikować potrzeby różnych interesariuszy - często potrzeby, których sam interesariusz nie zdaje sobie sprawy, że je ma - i zaproponować rozwiązanie, które działa dla wszystkich.

Prawdopodobnie sam to widziałeś wiele razy. Użytkownicy myślą o tym, jak muszą wchodzić w interakcje z systemem, zwykle w kontekście innego systemu, który już znają. Programiści myślą przede wszystkim o tym, jak działa system. Klienci zwykle chcą czegoś, co rozwiąże wszystkie ich problemy, lub też chcą rozwiązać bardzo specyficzny problem za jak najmniejszy koszt.

Aby zostać dobrym projektantem, musisz nauczyć się przestać myśleć o tym, jak coś zaimplementujesz. Zamiast tego musisz skupić się na tym, co inni interesariusze mówią ci o tym, czego potrzebują i chcą, i musisz umieć czytać między wierszami. Podobnie jak programiści, klienci i użytkownicy często mają na myśli pewne z góry przygotowane rozwiązanie i zwykle opisują to rozwiązanie zamiast podstawowych wymagań. (To powiedziawszy, ważne jest, aby zdawać sobie sprawę, że czasami klient ma na myśli to, co mówi, gdy mówi dokładnie to, czego chce; jeśli nie jesteś pewien, zapytaj).

Mówiąc bardziej powierzchownie, estetyczny wygląd interfejsu użytkownika jest również czymś, z czym niektórzy programiści mają problemy. Myślę, że jest to częściowo spowodowane tym, że programiści często nie mają dużego przeszkolenia w zakresie estetyki - studenci CS mogą nie mieć dużo czasu na zajęcia plastyczne. To również częściowo dlatego, że bardziej interesuje nas to, jak coś działa, niż to, jak to wygląda; po prostu nie obchodzi nas, czy rogi przycisku mają promień 9 pikseli, czy promień 10 pikseli. Te dwa czynniki są z pewnością powiązane. Czasami można temu zaradzić, polegając na rozwiązaniach w postaci konstruktorów interfejsu użytkownika, a użycie wstępnie zaprojektowanych komponentów ma tę zaletę, że ujednolica wizualnie własną pracę z innymi aplikacjami w tym samym systemie. Możesz poprawić swoje umiejętności estetyczne, czytając, patrząc na prace innych ludzi, zwracając szczególną uwagę na szczegóły wizualne, które mogłeś zignorować w przeszłości. Powinieneś także spróbować zrozumieć logikę różnic wizualnych: czy kwadratowe przyciski oznaczają coś innego niż zaokrąglone przyciski? Jak używany jest kolor? itp.

Caleb
źródło
1
dzięki za odpowiedź gr8, czy są jakieś zasoby, książki, strony mówią o tym temacie: „logika różnic wizualnych: czy kwadratowe przyciski oznaczają coś innego niż zaokrąglone guziki? W jaki sposób używany jest kolor?”.
Ali
Na marginesie i czysto z ciekawości, czy kwadratowe guziki oznaczają coś innego niż zaokrąglone guziki? Zastanawiam się, czy to rozwiązano na UX SE?
Sean Hanley,
Kolorowe i zaokrąglone przyciski są problemem graficznym i naprawdę nie mają nic wspólnego z UX. Lepszym pytaniem dla UX byłoby „co nasz użytkownik myśli o naszej witrynie ze schematem kolorów x kontra schemat kolorów y” oraz rozmieszczenie tych przycisków.
Nic
@Yadyn, to zależy od kontekstu. Geometria przycisku może dać użytkownikowi wskazówkę dotyczącą działania i zachowania: kwadratowe przyciski z rogami tworzą atrakcyjne grupy i często działają dobrze przy wybieraniu opcji lub trybów. Zaokrąglone przyciski nie układają się tak dobrze i często wskazują różne operacje. Ale tego rodzaju wskazówki wizualne mają znaczenie tylko wtedy, gdy są konsekwentnie stosowane w aplikacji lub (lepiej) w całym GUI.
Caleb
@melee, przychodzę do tego z punktu widzenia rozwoju aplikacji. Interfejsy w sieci są znacznie bardziej zróżnicowane i zgadzam się, że trudniej jest w tym przypadku przedstawić ten przypadek. Ale jeśli wybrałeś typową aplikację na komputer Mac i powiedziałeś „Niebieskie przyciski wyglądają świetnie - zmieńmy wszystkie przyciski na niebieskie!” spowodowałoby to wiele zamieszania dla użytkowników, ponieważ użytkownicy przywiązują znaczenie do koloru i formy przycisku. Przykłady tutaj (Apple HIG): tinyurl.com/6agv54v
Caleb
3

Pomóż mi kilka rzeczy:

  • Zwróć uwagę na to, co lubisz / czego nie lubisz w innym oprogramowaniu. Jesteśmy programistami, dużą część życia spędzamy przy komputerze. Staraj się zanotować to, co kochasz / nienawidzisz podczas korzystania z oprogramowania. Nie ma znaczenia, czy jest to oprogramowanie komputerowe, gry wideo, urządzenia mobilne itp., Po prostu staraj się uważać na to, co jest wygodne i łatwe w użyciu, a co nie.

  • Znajdź łatwe w użyciu narzędzie do szkicowania do szkicowania interfejsu użytkownika dla Ciebie i Twoich użytkowników. Uwielbiam używać Balsamiq, ponieważ jest szybki, prosty, a wersja internetowa jest darmowa.

  • Pamiętaj, że nie musisz szukać kogoś, kto specjalizuje się w projektowaniu oprogramowania, aby pomóc Ci coś zaprojektować - zrobi to każdy użytkownik. Często wykonuję swoje szkice przez osoby, które są całkowicie niezwiązane z projektem, tylko dlatego, że wiem, że są wokół oprogramowania przez cały dzień i mogą mi powiedzieć, czy coś wygląda dobrze lub jest przyjazne dla użytkownika. Pamiętaj, że często dają ci szalone pomysły na temat tego, co robić, i musisz wiedzieć, co byłoby po prostu „fajne”, a co faktycznie poprawiłoby produktywność.

  • Zapytaj na /ux// o szczegółowe pytania

Rachel
źródło
1
Dobra rada, dobre narzędzie
NoChance
2

Szczerze mówiąc, projektowanie interfejsu użytkownika to razem inna sprawa. Deweloper zawsze myśli o subtelnym projekcie i nie jest zbyt kreatywny, jeśli chodzi o projektowanie. Zdecydowanie podchodzę do tego, by zachować innego programistę do projektowania interfejsu użytkownika. Wprawdzie zwiększa to koszty, ale na pewno pomoże Ci osiągnąć lepsze wyniki.

Dla kogoś, kto robi obie rzeczy sam, nigdy tak naprawdę nie daje najlepszych rezultatów. Tak więc, IMHO te dwa różne aspekty należy przypisać dwóm różnym programistom. W przypadku różnych CMS zalecana jest niewielka znajomość HTML i CSS do tworzenia skórki i tworzenia motywów, ale jeśli potrzebujesz opracować zupełnie nowy projekt, skonsultuj się z projektantem interfejsu użytkownika.

Pankaj Upadhyay
źródło
2

Projektowanie interfejsu użytkownika nie jest czymś naturalnym dla wielu osób. Jednak ostatnio stałem się znacznie lepszy dzięki kilku prostym zasadom.

  1. Nie wariuj, to nie jest tak trudne, jak myślisz.

  2. Najpierw modeluj strukturę danych i silnik. Twórz jasne i odpowiadające rzeczywistości modele. Oczywiście zakłada to, że poświęciłeś czas na zrozumienie potrzeb klienta.

  3. Teraz, korzystając z kartki papieru i ołówka, usiądź i zacznij rysować logiczny układ ekranów. Zwykle przedstawia to model danych użytkownika w zorganizowany sposób. Twoim celem powinno być po prostu:

    za. Naśladuj środowisko, w którym aplikacja zostanie wdrożona. Na przykład, jeśli jest to aplikacja Windows, musi zachowywać się jak aplikacja Windows, jeśli jest to aplikacja internetowa, musi zachowywać się jak podobne aplikacje internetowe, które są bardziej popularne niż Twoja.

    b. Twoim celem jest poprowadzenie użytkownika przez Twój model danych w sposób, który ONI przewidzieli. Interfejs użytkownika jest dobrze zaprojektowany, gdy użytkownik robi coś w aplikacji i robi dokładnie to, czego się spodziewał.

    do. To wymaga czasu i jest to krzywa uczenia się, ale każdy może to zrobić.

  4. Nie martw się grafiką, tj. Przyciskami, tłem itp. ... Twoim jedynym celem w tym momencie jest logiczny układ strony.

  5. Musisz opanować używaną bibliotekę GUI, niezależnie od tego, czy jest to HTML, GTK, Kakao, Android, Windows, formularze itp. W zakresie, w jakim rozumiesz mechanizmy obsługi zdarzeń, silnik układu oraz pobieranie danych wejściowych i wyświetlanie dane. Każdy programista powinien być w stanie to zrobić.

  6. Nie ma się co wstydzić, że grafik może przejąć tę funkcję. Ale powinieneś przynajmniej być w stanie przejść krok 5. Jest to 95% obciążenia pracą całej aplikacji.

Oto przydatny artykuł, który zmienił mnie z biednego projektanta GUI w znacznie lepszego projektanta GUI.

http://www.joelonsoftware.com/uibook/fog0000000249.html

Jonathan Henson
źródło
Dobra rada, ale nie zgadzam się z punktem 2. Chciałbym również bardziej zaangażować użytkownika w powyższe kroki.
NoChance 26.09.11
1
@Emmad Jeśli uważasz, że aplikacja jest serią operacji wykonywanych na danych, jedynym celem interfejsu użytkownika jest zapewnienie zorganizowanego sposobu odbierania danych wejściowych do modelu danych i wyświetlania modelu danych. Powodem, dla którego umieściłem tam 2, jest to, że po modelowaniu danych interfejs użytkownika po prostu zaczyna działać. Przeprowadzam obszerne wywiady z użytkownikiem końcowym dotyczące tego, z jakiego rodzaju danymi chcą robić? To jest aplikacja. Następnie umieszczam rzeczy na stronie, a następnie pytam, jak chcesz to wyglądać? To nigdy nie zrobiło mi źle.
Jonathan Henson
1
Ponadto, kiedy pozwalam grafikom na rysowanie GUI, zawsze kończy się to katastrofą. Nie znają sposobu organizacji danych i prawie nigdy nie wiedzą, co jest, a co nie jest możliwe.
Jonathan Henson
Dziękuję za wyjaśnienie, zgadzam się z tobą, że grafikom nie należy powierzać zarządzania informacją.
NoChance,
1

Możesz także poszukać udanych przykładów „podobnych” witryn, aby uzyskać pomysły na układy, grafiki i projekty. Po drobnym dopracowaniu w swoim ulubionym programie do malowania możesz pożyczyć wiele pomysłów i dostosować je do własnych. Nie kopiuj wprost - to nie tylko złe maniery, w większości przypadków jest to również nielegalne.

Gdy pożyczysz kilka razy, zaczniesz lepiej czuć projekty odnoszących sukcesy witryn, a także poznasz narzędzia do tworzenia tych projektów (z drobnymi poprawkami).

Joris Timmermans
źródło
1

Wraz z wprowadzeniem HTML tworzenie prostego, nieprzyjemnego serwisu stało się wyzwaniem. Chociaż możesz mieć tę koncepcję, potrzeba kilku sztuczek, narzędzi, gotowej grafiki i wiedzy CSS, aby ją poprawnie wykonać. Techniki użyteczności i inne czynniki ludzkie wpływające na proces projektowania są wymagane do uzyskania ostro wyglądających stron.

Programiści spędzają większość czasu na walce ze złożonymi językami, OOP, ORM, SQL, T-SQL itp. Ponadto rzadko inwestują w narzędzia do tworzenia stron internetowych (większość z nich jest droga).

W rezultacie wielu programistów cierpi z powodu niemożności tworzenia oszałamiających stron internetowych. Wierzę, że jeśli nauczysz się wymaganych narzędzi, będziesz w stanie również tworzyć dobre strony.

Ważne jest również, aby wiedzieć, jaka jest Twoja rola w procesie tworzenia aplikacji. Może się okazać, że projektowanie stron internetowych jest umiejętnością, a raczej umiejętnością obowiązkową. W dużych projektach nie powinno to być zadaniem programisty przynajmniej z wyżej wymienionych powodów.

Odkryłem, że to narzędzie jest doskonałym narzędziem, które może ci pomóc:

Artysta

Spójrz na to i wypróbuj wersję demo, jest naprawdę dobra.

Bez szans
źródło
1

wciąż w rozwoju stron internetowych dobre umiejętności programistyczne nie wystarczą bez wielkich umiejętności projektowania

Nie wiem, czy to stwierdzenie jest prawdziwe, myślę, że zależy to od tego, gdzie pracujesz.

Na przykład mniejsza firma prawdopodobnie będzie wymagać od ciebie większej elastyczności w zakresie umiejętności, podczas gdy duża firma może nie mieć takich samych oczekiwań i możesz poświęcić cały swój czas na rozwój, podczas gdy zespół projektowy pracuje nad projektowaniem.

Microsoft faktycznie zaktualizował swój zestaw narzędzi, aby podkreślić wyraźne oddzielenie programistów od projektantów. Wprowadzili Expression Blend z WPF, co oznacza, że ​​programista może pracować nad funkcjonalnością oprogramowania, a ktoś inny może zaprojektować go. Oba używają różnych narzędzi, oba mogą pracować nad projektem w tym samym czasie, ale jeden funkcjonuje, a drugi projektu.

Deweloper określa punkty danych, a projektant je wyświetla.

AndrewC
źródło
dzięki, myślałem o tym, robiąc to bez zespołu, robiąc to jako samotny freelancer!
Ali
Zdecydowanie nieprawda w dużej firmie. Ma oddzielne zespoły projektowe i programistyczne i oba potrzebują od siebie tylko minimalnej wiedzy (wiedz, co jest możliwe, wiedz, co jest zepsute).
SF.
1

Pamiętaj, że projekt można również przetestować, nie tylko kod. Zacznij od prostych, wypróbuj swój projekt na małej grupie ludzi, zapisz ich opinie i stamtąd. Może to pomóc w zidentyfikowaniu problemów z projektem i dać ci wyobrażenie o tym, co można / należy zrobić inaczej. Następnie popraw projekt i powtórz.

Harald
źródło
0

Musisz tylko sfałszować i skopiować inne projekty. Unikaj czegokolwiek wymyślnego, z wyjątkiem jednej lub dwóch funkcji, które będą dużą korzyścią dla użytkowników. Postępuj zgodnie z podstawowymi praktykami ograniczania czcionek, kolorów i bałaganu.

Nie bój się zamieszczać pytań na UI.stackexchange.com

JeffO
źródło
+ 1- dobry punkt na temat ograniczenia kolorów itp. Znakiem interfejsu użytkownika programisty jest zazwyczaj neonowe tło z migoczącym znacznikiem wokół wszystkich przycisków i znacznikiem markizy wokół wszystkiego innego. Dobrze wyglądające strony internetowe używają wartości domyślnych (białe tło, zwykłe czcionki itp.) W 90%, z kilkoma fajnymi odchyleniami.
Morgan Herlocker,
0

Mimo że nie jest to twoja specjalizacja, myślę, że zawsze warto uczyć się, jak tworzyć interfejsy użytkownika. Obecnie większość stron internetowych jest bardzo dynamiczna i znajomość niektórych umiejętności interfejsu użytkownika z pewnością pomogłaby w tworzeniu komponentów i ustawianiu ich interakcji z elementami strony. Pochodzę z zaplecza programistycznego opartego tylko na backendach i byłem zaskoczony, jak bardzo zaangażowane jest tworzenie interfejsów.

Jest szczególnie dobra książka, którą przeczytałem o projektowaniu stron internetowych i jest skierowana do programistów:

Projektowanie stron internetowych dla programistów: http://pragprog.com/book/bhgwad/web-design-for-developers

Jest to czytelna książka, która dotyka wszystkich faz podczas tworzenia interfejsów: od zwykłego interfejsu użytkownika do szkicowania i prototypowania po tworzenie projektów za pomocą HTML + CSS.

Aby jeszcze bardziej poprawić swoje umiejętności obsługi interfejsu, polecam również najnowszy screencast PeepCode z Ryanem Singerem: http://peepcode.com/products/ryan-singer-ux

Fabio Kenji
źródło
0

Myślę, że zapoznanie się z podstawami UX / UI / grafika / typografia jest z pewnością cennym przedsięwzięciem. Oczywiście nie zawsze można mieć „dobrze zaokrąglony” zespół specjalistów. Wiele razy ludzie muszą nosić wiele czapek. Dobry programista doceni wartość spędzania czasu na poznawaniu rzeczy poza swoją domeną i powinien być w stanie przynajmniej rozpoznać dobrą pracę w projektowaniu.

Można jednak powiedzieć coś o tym, co robią projektanci. Deweloper może zrobić tylko tyle w dziedzinie projektowania (co prawda, że ​​więcej niż inni). W szczególności duże projekty publiczne wychodzące poza wąską niszę przynoszą ogromne korzyści dzięki zatrudnieniu prawdziwych projektantów. Nie chodzi mi po prostu o ludzi, którzy potrafią ominąć kody kolorów css i html. Mam na myśli ludzi, którzy spędzili LATA studiując takie rzeczy jak typografia, którzy przeczytali i zrozumieli kolorową książkę Josefa Albera , którzy potrafią robić piękne szkice z kruszącym się węglem drzewnym na papierze gazetowym. Są to cenne umiejętności, a projekty, które to uznają i które mogą skoncentrować się na ich wykorzystaniu, mają zdecydowaną przewagę nad konkurencją.

To powiedziawszy, istnieją pewne obszary, w których projektanci i programiści mogą nakładać się na swoje umiejętności. Zwłaszcza UX i jego subdomena, UI. Polecam ...

Angelo
źródło
0

Zatrudnij profesjonalistę.

Poważnie, interfejsy użytkownika od programistów mają okropną reputację. Nie dzieje się tak dlatego, że programiści są poniżej średniej przy projektowaniu, ale raczej dlatego, że programiści są poniżej średniej przy proszeniu o pomoc.

Deweloper ma tendencję do podejmowania każdego cyfrowego wyzwania, które nadejdzie.

(Byłem zawodowym programistą przez 10 lat, a moja żona jest projektantem interfejsu użytkownika przez 20 lat)

Kris Van Bael
źródło