zdobycie pracy jako inżynier UX jest trudne, ale nie niemożliwe. Ta lista została stworzona, aby pomóc ci zawęzić koncentrację i opanować umiejętności potrzebne do zostania inżynierem UX w 2020 roku. Co zrozumiałe, ta lista może być nieco przytłaczająca dla każdego, kto dopiero zaczyna. Z tego powodu lista jest podzielona na dwie części:

  • UX design Skills
  • Front-End Engineering Skills

Jeśli jesteś nowicjuszem w każdej dziedzinie, polecam skupienie się na jednej liście na raz. W ten sposób, można jeszcze wylądować niesamowitą pracę i zarabiać jak budować swoje umiejętności z drugiej listy.

Umiejętności UX-design

W świecie tworzenia stron www, ux-design ma kluczowe znaczenie. Podczas gdy umiejętności inżynierskie front-end są niezbędne do tworzenia szybkich i skalowalnych produktów, to umiejętności projektowania ux zapewnią, że te produkty nie będą marnować wysiłku. Bez pewnej wiedzy na temat projektowania ux możesz spędzić tygodnie lub miesiące budując produkt, którego nikt nie chce. UX design pomaga usunąć wątpliwości, dzięki czemu możesz tworzyć produkty, które ludzie naprawdę uważają za przydatne.

#1 – empatia

empatia jest sercem ux design. Musisz umieć postawić się w butach swojego użytkownika, aby projektować produkty, które pokochają. Na szczęście empatia nie jest trudną umiejętnością do rozwijania. Jeśli rozumiesz, dlaczego niektóre produkty cię uszczęśliwiają i dlaczego niektóre produkty Cię frustrują,to jesteś w połowie drogi!Temat: empatia w projektowaniu: jak to działa?Deweloperzy mogą czasami zmagać się z empatią, ponieważ ulepszenia UX mogą wydawać się niewielkie w porównaniu do” kosztów ” ich wdrożenia. Jeśli to Ty, oprzyj się pokusie stawiania własnej wygody ponad zadowolenie użytkownika. Nie podchodź na skróty. Miej empatię. Zacznij od doświadczenia użytkownika i pracuj wstecz.

#2 – Rozwiązywanie problemów

umiejętności rozwiązywania problemów są ważne zarówno dla projektowania ux, jak i inżynierii front-end. Jednak uważam, że jest to jeszcze ważniejsze dla ux. Dlaczego? Ponieważ większość problemów ux jest unikalna i specyficzna dla potrzeb użytkownika. Często o wiele łatwiej jest znaleźć odpowiedzi na pytania programistyczne niż w przypadku problemów z ux.Mając to na uwadze, potrzebujesz możliwości wymyślenia kreatywnych rozwiązań dla różnych problemów. Dzięki empatii i umiejętnościom rozwiązywania problemów możesz zacząć rozumieć problemy użytkownika i projektować dla niego prawdziwe rozwiązania.

#3 – obserwacja

jak wspomniano, większość problemów ux jest unikalna, ale nie wszystkie. Posiadanie umiejętności obserwacji pozwoli Ci zaoszczędzić wiele bólów głowy w dół drogi. Ta umiejętność jest szczególnie przydatna w” projektowaniu „elementu” ux design”.”Twoi użytkownicy są w całej sieci. Używają mediów społecznościowych, czytają Blogi, oglądają filmy na YouTube. Jeśli oni to robią, to Ty też powinieneś to robić.Umiejętności obserwacji pomagają dostrzec pojawiające się wzorce i wyprzedzić oczekiwania użytkownika, gdy trendy staną się nową normą.Related: dobry UX = nudny UI. Nie bądź kreatywny bez wielkich umiejętności obserwacji, trudno nadążyć w szybko rozwijającej się branży tworzenia stron internetowych.

#4 – Marketing

osobiście uważam, że ten nie jest wystarczająco wspomniany. W wielu firmach projektanci UX ściśle współpracują z działem marketingu. Jako Projektant ux powinieneś przynajmniej mieć podstawową wiedzę na temat tego, czym jest marketing i jak działa. Ogólnie rzecz biorąc, koncepcja marketingu ma długą historię śledzenia potrzeb klienta i punktów bólu. Istnieje więcej skrzyżowań między marketingiem a projektowaniem ux, niż możesz sobie wyobrazić, zwłaszcza w dzisiejszych technologiach world.At koniec końców, musisz zadowolić użytkowników i każdego, kto podpisze Twoją wypłatę. Inwestując trochę czasu, aby nauczyć się umiejętności marketingowych, będziesz lepiej pozycjonować się, aby zapewnić wartość dla użytkowników i firmy.

#5 – badania UX& wywiady

w wielu firmach badania ux są całkowicie oddzielną rolą od projektowania ux. Ale to nie znaczy, że jesteś wolny. Nie ma czegoś takiego jak projektowanie ux bez badań ux, więc nie zajdziesz daleko bez nauki. Aby dokładnie zrozumieć badania ux, potrzebujesz stopnia w interakcji człowiek-komputer lub pokrewnej dziedzinie. Jednak, jako inżynier ux, wierzę, że można przejść bez stopnia.Jeśli nauczysz się, jak zbierać dane jakościowe od użytkowników bez narażania wyniku, będziesz miał w zasadzie większość umiejętności potrzebnych do prowadzenia badań ux. Podstawową umiejętnością jest umiejętność oddzielania się od swoich projektów. Musisz być świadomy własnych uprzedzeń i nauczyć się obiektywnie projektować. Naucz się tego, a będziesz gotowy.

#6 – Statystyka& analityka danych

chociaż statystyka i analityka danych mieszczą się pod parasolem „UX Research”, myślę, że jest wystarczające rozróżnienie, aby je tutaj nazwać osobno. Wykorzystanie danych ilościowych to bardzo skuteczny sposób na zrozumienie interakcji użytkowników z produktem. Masz wysokie współczynniki odrzuceń? Może być konieczne ponowne rozważenie nawigacji. Czy użytkownicy opuszczają Twoją stronę po kilku sekundach? Być może ładowanie strony trwa zbyt długo. To tylko kilka wskaźników, które Google wykorzystuje do określenia ogólnego doświadczenia użytkownika witryny. Jeśli Google zwraca na nie uwagę, to powinieneś być too.As dyrektor generalny Google, Eric Schmidt stwierdził:

świat zostanie odziedziczony przez statystyków

Niestety, oprogramowanie do analizy danych może tylko do tej pory. Będziesz potrzebował lepszego zrozumienia statystyk, poza obliczaniem średnich, aby pomóc w podejmowaniu decyzji opartych na danych jako inżynier ux.

#7 – narzędzia do projektowania UI

teraz w końcu przechodzimy do strony „projektowania”. Jednym z największych aspektów projektowania ux jest tworzenie szkieletów, makiet i prototypów. Najpopularniejsze narzędzia do projektowania interfejsu użytkownika to Sketch i Figma. Właściwie nigdy nie używałem żadnego z nich (czy wspomniałem, że technologia porusza się szybko?), ale gdybym miał teraz wybierać między tymi dwoma, wybrałbym Figmę.AJ&inteligentny zrobić dobre (i Śmieszne) porównanie w tym filmie. Warto obejrzeć.

#8 – zasady projektowania UI

być może zauważyłeś, że „ux” i „ui” są zwykle sparowane? To dlatego, że oba są niezbędne dla ogólnego doświadczenia użytkownika. Badania UX pomogą Ci zidentyfikować i rozwiązać konkretne problemy projektowe, ale nie pomogą Ci stworzyć pięknego projektu. W tym celu musisz zrozumieć zasady projektowania interfejsu użytkownika i jak z nich skutecznie korzystać.Istnieją pewne, uniwersalne „prawdy” o projektowaniu, które każdy Projektant ux powinien znać. Jeśli masz świetne umiejętności obserwacyjne (#3 na tej liście), prawdopodobnie zapoznałeś się z zasadami projektowania interfejsu użytkownika, nawet nie zdając sobie z tego sprawy. Niektóre z tych zasad obejmują równowagę, wyrównanie, kontrast itp.Twój interfejs użytkownika jest płótnem, a Ty jesteś artystą. Zastosowanie zasad projektowania interfejsu użytkownika to różnica między stworzeniem arcydzieła a zrobieniem czegoś, co przyklei się do lodówki. To naprawdę robi wielką różnicę. Jeśli twój projekt interfejsu użytkownika nie ma znaku, ludzie zauważą i nie będą mieli zaufania do Twojej marki.Podobne: UX Design &Projektowanie UI. Dlaczego potrzebujemy ich obu?

#9 – projektowanie interakcji

z poprzednią umiejętnością, zasadami projektowania ui, masz do czynienia z wyglądem pojedynczych stron internetowych lub funkcji naraz. Z drugiej strony, dzięki umiejętnościom projektowania interakcji musisz zrobić krok wstecz i zrozumieć, w jaki sposób ta strona lub funkcja łączy się z „dużym obrazem”.”Jak sama nazwa wskazuje, interaction design zajmuje się kierowaniem interakcją Twojego produktu.Bez projektowania interakcji twój produkt będzie czuł, że czegoś mu brakuje. W Google Material Design spec, na przykład, celem jest traktowanie elementów na stronie tak, jakby istniały w prawdziwym świecie. Oznacza to, że obiekty poruszające się po stronie powinny przyspieszać lub zwalniać, tak jakby przestrzegały praw fizyki.

#10 – pisanie& Komunikacja

pisanie i umiejętności komunikacyjne są ważne dla większości kariery, ale są szczególnie ważne dla projektantów ux. Rzadko projektuje się interfejsy, które nie wymagają tekstu, ikon ani obrazów do celów komunikacji. Oznacza to, że musisz nauczyć się, jak w pełni przekazać wiadomość tak zwięźle, jak to możliwe.Pisanie skutecznej kopii nie jest takie proste, jak się wydaje. Czytelność i rozumienie to nauka. Ważne jest, aby nauczyć się mówić w języku odbiorców, ale co ważniejsze, zaangażować ich w swoją kopię. Jednym z błędów, który jest łatwy do popełnienia, jest swobodne użycie dużych słów, które mogą być trudne do zrozumienia dla publiczności. Nie popełnij tego błędu. Twoim zadaniem jest efektywna komunikacja, a nie imponowanie czytelnikom swoją wiedzą.

umiejętności inżynierskie Front-End

nigdy nie było bardziej ekscytującego czasu na bycie inżynierem front-end. Dzisiejsza branża tworzenia stron internetowych kwitnie dzięki innowacjom. Codziennie powstają nowe narzędzia i zasoby, które ułatwiają nam pracę. Jednak te narzędzia i zasoby mają również krzywą uczenia się. Jeśli jesteście gotowi rozpocząć pracę z inżynierią front-endową, następne 10 umiejętności będzie dla was kluczowe.

#11 – HTML, CSS, & JavaScript

krajobraz stron zmienił się diametralnie od samego początku. Od dzisiejszych inżynierów front-end oczekuje się znajomości narzędzi, metodologii i najlepszych praktyk, które jeszcze kilka lat temu nie istniały. Wszystko dzieje się tak szybko. Jako inżynier front-end będziesz stale musiał uczyć się nowych umiejętności, aby pozostać trafnym.A może chcesz?W sensie ogólnym, tak, zawsze będziesz się uczyć. Jednak fundament tworzenia stron internetowych zawsze pozostawał taki sam. U podstaw zawsze mieliśmy HTML, CSS i JavaScript. Ucz się tych rzeczy i ucz się ich dobrze. Wszelkie dodatkowe informacje, których się nauczysz, i tak będą oparte na tych technologiach (w większości przypadków).Zawsze będzie nowy i ekscytujący framework lub biblioteka. Jeśli nie masz zrozumienia zwykłego starego HTML, CSS i JS, to nie powinieneś kupować najnowszego frameworka, dopóki tego nie zrobisz (moim zdaniem). Dzięki zrozumieniu tajników JavaScript, na przykład, zajdziesz znacznie dalej w dłuższej perspektywie, jeśli przejdziesz od razu do nauki Reacta dzisiaj. Za kilka lat pojawi się nowy framework, a Ty będziesz ciężko się go nauczyć. Zaoszczędź sobie bólu głowy i naucz się najpierw pisać zwykły HTML, CSS i JS.Pokrewny: projektanci powinni nauczyć się kodować (między innymi)

#12 – semantyczny HTML & dostępność

HTML jest używany do opisywania Twojej strony w przeglądarce, a także osób niepełnosprawnych. To nie narzędzie do projektowania. Po opanowaniu podstaw języka HTML będziesz chciał zagłębić się w semantykę i dostępność. Dowiesz się, że HTML to coś więcej niż tylko zawijanie wszystkiego w znacznik <div>.Semantyczny HTML zajmuje się przede wszystkim wyrażaniem „znaczenia” strony internetowej. Używając na przykład elementu <nav>, zasadniczo informujesz przeglądarki, gdzie znajduje się nawigacja. W miarę jak przeglądarki stają się inteligentniejsze, semantyczny HTML staje się coraz ważniejszy dla rozwoju sieci.Bardzo ważne jest również udostępnienie produktów osobom niepełnosprawnym. Jeśli wybrałeś umiejętność nr 1 na tej liście (empatia), być może znasz wytyczne dotyczące dostępności treści internetowych (WCAG)? Jeśli nie, powinieneś się ich nauczyć. Twój produkt nie jest naprawdę przyjazny dla użytkownika, dopóki nie będzie dostępny dla wszystkich.

#13 – frameworki CSS, Architektura,& Preprocesory

Po tym, jak poświęcisz trochę czasu na naukę CSS, zaczniesz doceniać potrzebę frameworków, metodologii i preprocesorów.W zależności od sytuacji, Bootstrap to świetny Framework CSS, który szybko przenosi Style na Twoją stronę. Jeśli jednak projekt wymaga czegoś mniej „Bootstrappy”, prawdopodobnie lepiej jest napisać własny CSS od podstaw (powrót do podstaw). Ponadto, jako inżynier UX, wydajność będzie ważnym czynnikiem do rozważenia dla Twoich produktów. Korzystanie z Bootstrap po wyjęciu z pudełka może mieć wady, jeśli chodzi o wydajność.Korzystanie z preprocesora CSS, takiego jak Sass, jest Świetne z wielu powodów. Przede wszystkim znacznie ułatwiają pisanie CSS, umożliwiając zagnieżdżanie stylów w sobie, aby stworzyć specyfikę. Jest też kilka innych fajnych funkcji, takich jak używanie zmiennych i mixinów. W dzisiejszych czasach nie znajdziesz wielu inżynierów front-end, którzy nie używają preprocesora, aby uprościć swój proces.Jeśli piszesz własne style od podstaw, przyjęcie architektury CSS jest niezwykle przydatne do utrzymania porządku w kodzie. Używałem tylko skalowalnej i modułowej architektury CSS (SMACCS), co jest świetne, ale ostatnio dowiedziałem się o innych metodykach CSS. CSS łatwo wymknie się spod kontroli, jeśli nie masz dobrej strategii organizacji. Zdecydowanie warto zaadoptować architekturę CSS do procesu rozwoju.Podobne: specyfika CSS: jak uniknąć używania !ważne w CSS #14-projektowanie responsywne

projektowanie responsywne nie jest już niczym nowym. Jest to niemal synonim projektowania stron internetowych w tym momencie. Niemniej jednak nadal ważne jest, aby nauczyć się uwzględniać wiele różnych urządzeń i rozdzielczości ekranu w swoich projektach. Brak nauki projektowania responsywnego to szybki sposób na pozostawienie połowy użytkowników poza równaniem, co oczywiście prowadziłoby do słabego doświadczenia użytkownika.Jesteśmy teraz w mobilnym świecie. Mobile nigdzie się nie wybiera. Dowiedz się, jak projektować urządzenia mobilne, tablety i komputery, a będziesz gotowy do pracy.

#15 – frameworki JavaScript

frameworki JavaScript są ważne, ponieważ programowanie jest drogie. Frameworki takie jak jQuery, Angular, Vue i React zostały stworzone, aby przyspieszyć rozwój i wykonać wiele ciężkich prac za Ciebie. Z tego powodu firmy nie mają skrupułów co do przyjęcia frameworków JS, ponieważ pozwala im to zaoszczędzić pieniądze na dłuższą metę.Oczywiście istnieje więcej RAM JavaScript, niż możesz liczyć na dwie ręce. Wszyscy starają się rozwiązać inny problem. Warto byłoby zrozumieć, które ramy są tam. Warto byłoby również nauczyć się co najmniej jednego frameworka JavaScript, który pomoże Ci w tworzeniu stron internetowych. React wydaje się być obecnie najpopularniejszym wyborem, ale to może się łatwo zmienić w ciągu kilku krótkich lat.

#16 – backend Development

Programiści Front-end współpracują z programistami backendu dość ściśle. Nie sugeruję, że powinieneś zostać inżynierem full-stack (chociaż byłoby to dość imponujące). Sugeruję jednak, że warto byłoby dowiedzieć się wystarczająco dużo o back-endzie, aby lepiej zaangażować się w twój back-end coworkers.At pod koniec dnia prawdopodobnie będziesz decydować, jakie dane są potrzebne do wsparcia twoich projektów. Przyzwoite zrozumienie rozwoju zaplecza pomoże wspierać tę komunikację i zapewnić sukces projektu.

#17 – testowanie& debugowanie

Testowanie i debugowanie jest krytyczne dla każdego, kto pracuje nad kodem front-end. Istnieje wiele różnych sposobów „testowania” produktu, ale Typ testów, które wykonasz najczęściej, będzie polegał na testowaniu przeglądarki i JavaScript.Narzędzia programistyczne Chrome (Dev Tools) to bardzo potężne i poręczne narzędzie. Dev Tools pozwala szybko wprowadzać zmiany w HTML / CSS i zobaczyć, jak renderuje się na stronie. Konsola pozwala zobaczyć, kiedy masz błędy w JavaScript. Karta sieci pozwala zobaczyć, jak szybko i w jakiej kolejności renderowane są pliki. To może zrobić o wiele więcej. Jeśli dopiero zaczynasz pracę nad front-endem, wkrótce zdasz sobie sprawę, jak niesamowite są narzędzia programistyczne is.To upewnij się, że Twoja witryna wygląda dobrze we wszystkich przeglądarkach i urządzeniach. Browserstack to bardzo poręczne narzędzie do tego typu testing.In Test Driven Development (TDD), Twój JavaScript będzie musiał zostać przetestowany, aby upewnić się, że pokrywasz wszystkie swoje podstawy. Narzędzia takie jak Karma pomogą Ci rozpocząć tworzenie testów wokół kodu.

#18 – Menedżery pakietów (npm)

Menedżery pakietów, takie jak npm, stały się koniecznością dla nowoczesnego front-endu. Ułatwiają życie. Z eksplozją zasobów, frameworków, bibliotek itp. na wyciągnięcie ręki zaczyna być dość bolesne zarządzanie nimi wszystkimi…..chyba że używasz menedżera pakietów.Nauka npm wymaga użycia interfejsu wiersza poleceń (CLI). To nie jest takie straszne, jak się wydaje. Istnieje wiele samouczków online, które mogą Ci pomóc, gdy jesteś gotowy do włączenia menedżerów pakietów w proces tworzenia stron internetowych.

#19 – narzędzia do budowania

oprócz npm, musisz również wiedzieć o narzędziach do budowania, takich jak Pakiety modułów, biegacze zadań i Lintery. Narzędzia te mają różne cele, ale są niezbędne do nowoczesnego tworzenia stron internetowych.Pakiety modułów, takie jak WebPack, zostały stworzone, aby pomóc ci śledzić zależności modułów między plikami i połączyć je w jeden zasób. Jedną z głównych zalet korzystania z narzędzia takiego jak WebPack jest koncepcja „Tree Shaking”, która zapobiega niepotrzebnemu ładowaniu niewykorzystanych zasobów.Task Runners, takie jak Gulp, pozwalają na uruchamianie narzędzi takich jak WebPack i Sass. Są one przydatne, ponieważ mogą obserwować zmiany w plikach Sass lub WebPack i automatycznie odbudowywać dane wyjściowe. Nauka korzystania z biegacza zadań z pewnością pomoże zwiększyć twoje productivity.As pracujesz z zespołem innych inżynierów front-end, ważne jest, aby upewnić się, że przestrzegasz przewodnika stylu dla kodu JavaScript. Tutaj przydają się lintery, takie jak ESLint. Lintery pozwalają określić reguły dotyczące odstępów, składni, nazewnictwa itp. w Twoim kodzie. Kiedy złamiesz te zasady, Twój linter poinformuje Cię o tym. Zasadniczo lintery są użytecznym sposobem zapewnienia jakości i spójności współdzielonej bazy kodu. #20-Kontrola wersji każdy popełnia błędy. Na szczęście istnieje kontrola wersji. Jako inżynier front-end, konieczne będzie nauczenie się, jak używać kontroli wersji, takiej jak Git lub Team Foundation Server (TFS). Kontrola wersji pozwala na odłączenie kodu produkcyjnego (zasadniczo, tworzenie jego kopii) i wprowadzanie zmian bez konieczności martwienia się o zepsute rzeczy poza naprawą. Jeśli jednak coś pójdzie nie tak, na przykład złe wdrożenie, Kontrola wersji może uratować sytuację, umożliwiając cofnięcie zmian do poprzedniej wersji. czy jesteś gotowy, aby zostać inżynierem UX? więc masz to: 20 umiejętności, których potrzebujesz, aby zostać inżynierem UX w 2020 roku. Mam nadzieję, że ta lista okazała się przydatna podczas pracy nad poprawą swoich umiejętności. Jeśli jesteś gotowy zostać inżynierem UX, zajrzyj na forum jobs board! Jeśli chcesz dowiedzieć się więcej o projektowaniu UX lub inżynierii Front-End, rozważ subskrypcję Uxe co tydzień i otrzymuj nowy artykuł o inżynierii UX co tydzień!

Zostań jednorożcem

Pobierz artykuły o UX/UI Design + Front-End Development

jest za darmo – bez spamu – Zrezygnuj w każdej chwili

Udostępnij przez: