Blog firmy Poliman

Tworzymy portale, strony internetowe, gry i aplikacje. Projektujemy, programujemy, obsługujemy i inspirujemy.

User Experience i User Interface dwa popularne ostatnio zwroty…ale co to takiego?

 

Ostatnio to bardzo modne i często poruszane tematy, jednak nie każdy wie o co do końca chodzi w tym całym UX i UI. Razem rozszyfrujemy czym właściwie są te tajemnicze zwroty. W tym wpisie zwrócimy uwagę na UX.

Nie ma nic dziwnego w tym, że ciężko Ci określić czym jest UX, bo jest to dziedzina młoda, ale jednocześnie prężnie rozwijająca się.
Warto zatem zagłębić się w ten temat bo jeszcze nie raz o tym usłyszymy.

Pewnie doskonale wiesz, że podczas projektowania strony www należy pamiętać o umożliwieniu łatwego poruszania się użytkownika po stronie. Wiadomo, że w przypadku stron wizytówek sprawa jest prosta (chodź nie zawsze) ale w kwestii dużych portali i aplikacji bez tego się nie obejdziemy!

Ale jak dokładnie wygląda praca projektanta UX? Czym on się zajmuje? I co właściwie kryje się pod skrótem UX? Odpowiedzi na te pytania znajdziesz poniżej.

UX to skrót od słów User Experience. Jest to termin, który opisuje satysfakcję użytkownika, którą czerpie z interakcji z produktem.

Jeżeli te doświadczenia są przyjemne, a użytkownik może sprawnie poruszać się po witrynie mamy do czynienia z zadowolonym klientem, co daje nam niemal stuprocentową pewność jego kolejnej wizyty na naszej stronie.

Jeśli nasza strona nie spełnia jego wymogów, przede wszystkim nie jest użyteczna i nie oferuje odpowiedzi na nurtujące go pytania, to u naszego usera może pojawić się frustracja i decyzja o wyjściu ze strony, nie dająca cienia szansy na ponowne odwiedziny.

Można na tej podstawie stwierdzić, że UX to myślenie z punktu widzenia użytkownika.

Każda interakcja może być odebrana jednak subiektywnie. To tak, jak w wypadku miłośników soku pomidorowego. Są ci, którzy go uwielbiają i ci którzy go nie znoszą. Obydwa odczucia są prawdziwe, dlatego tak samo w przypadku projektów, specjaliści odnoszą się do praktyk które uznaje się za najlepsze, więc pewnie wybraliby sok pomarańczowy!

Co to jest projektowanie UX i z jakich etapów się składa?

  • koordynacja tego co podlega kontroli
  • rozpoznanie tego na co nie ma się wpływu
  • zredukowanie tego co dostarcza negatywnych doświadczeń

To prowadzi do myślenia zarówno o szczegółach jak i o całości. User Experience Designer nie ogranicza się jedynie do tworzenia użyteczności, projektu graficznego, czy komunikatów zwrotnych. W jego gestii leżą także inne obszary.

Co jeszcze wchodzi obszar zainteresowań UX?

  • architektura informacji
  • strategia informacji
  • użyteczność
  • dostępność
  • projekt wizualny
  • projekt graficzny
  • technologie informacyjne

Zastanawiasz się czym zajmują się projektanci UX? Odpowiadamy.

Przede wszystkim pracują nad:

  • strategią produktową
  • modelami użytkownika
  • jego potrzebami
  • prototypami, np. aplikacji i systemów
  • testowaniem rozwiązań które mają być wykorzystane, np. w aplikacji czy systemie

Projektanci UX to projektanci, a może nawet bardziej kreatorzy rozwiązań, którzy powinni być jednocześnie:

  • badaczami
  • analitykami
  • designerami
  • technologami

Co jest najważniejsze dla projektanta UX?

  • Przede wszystkim Użytkownik – tu nie obejdzie się bez badań i poznania użytkowników
  • Kontekst użycia – w jakich okolicznościach, sytuacjach jest używany produkt (projektowanie sytuacji)
  • Treść – często kończy się ograniczaniem treści

Z czym powinno Ci się kojarzyć określenie UX?

  • praca koncepcyjna
  • praca analityczna
  • praca nad dostosowaniem produktu do użytkownika

 


Teraz mam nadzieje, że wiesz czym jest UX i co robi osoba zajmująca się tym.
Jeżeli ten artykuł okazał się pomocny zostaw komentarz!


 

Trend na stronę…

 

Jak zaprojektować stronę by zwiększyć zaangażowanie użytkowników naszej witryny w publikowane na niej treści?

Tutaj znajdziesz klika wskazówek, na temat trendów w designie stron www.

Świat designu, projektowania stron internetowych można porównać do świata mody. W oby przypadkach, to co dostajemy jako nowe, natychmiast używamy, eksploatujemy jak tylko się da, na wszystkie możliwe sposoby. Dzieje się tak do momentu, aż nie zaoferują nam czegoś nowego, co sprawi, że zaczniemy postrzegać poprzedni trend jako już absolutnie niemodny.

 

W tym roku w świecie projektowania strony najmocniej zaznaczają się następujące trendy:

 

1.Zdjęcia i obrazy… w baaardzo dużym rozmiarze

Głównym powodem umieszczania bardzo dużych obrazów i wysokiej jakości ogromnych zdjęć jest to, że angażują one znacznie bardziej uwagę odwiedzającego witrynę aniżeli tekst. Obrazy i fotografie w prosty i jasny sposób komunikują jaka działalnością zajmuje się firma, bądź na witrynę o jakiej tematyce trafił.

duze zdjecia

 

2. Zwrot ku mobilności

Profesjonalna i nowoczesna firma musi dostosować swoja witrynę do posiadaczy mobilnych urządzeń. Trend ten obecny jest w dużej mierze dlatego, że przybywa coraz więcej użytkowników takich przenośnych urządzeń. Zmuszeni jesteśmy do jak najlepszej adaptacji stron www do zachowań, możliwości i potrzeb takich użytkowników. To pokazanie się jako dostępnych i otwartych na wszystkich użytkowników

iphone-speech-conference-cell-phone

 

3. Czcionki, duże i oryginalne

Ogromny wpływ na wrażenia estetyczne i przede wszystkim na użyteczność jakie odnosi użytkownik ma typografia. Zastosowanie dużego i oryginalnego tekstu sprawia, że strona jest inna niż wszystkie. Duża czcionka ułatwia czytanie strony. A zastosowanie większej czcionki do podkreślenia najważniejszych treści czy tytułów wspomaga wyszukiwanie informacji. Typografia to ważny element każdej strony www. Duża czcionka będzie dobrze współgrała ze wspomnianymi obrazami i fotografiami.

czcionki

 

4. Przejrzystość strony

Przejrzysta, lekka w odbiorze strona częściej przyciąga usera. Celem jest stworzenie nowoczesnego, jasnego i użytecznego nośnika proponowanych przez nas treści. Dlatego mówiąc kolokwialnie powinniśmy „odchudzić” naszą stronę z niepotrzebnych treści, które tylko rozpraszają uwagę odwiedzającego nasza stronę.

przejrzystosc strony

 

5. One – page leyout czyli przewijanie bez końca

Już nie tak nowym, ale nadal dobrze trzymającym się trendem są strony leyout’owe, które stawiają na wyłączne scrollowanie witryny. Budowa strony one-page’owej zakłada, że klikanie w linki to sztuczna czynność stwarzająca barierę między stroną www, a użytkownikiem. Odwiedzający witrynę jest prowadzony po ścieżce i stopniowo po kolei zapoznaje się z treściami dostępnymi na stronie. Trend ten pozwala na dokładne poznanie oferty strony internetowej, bez klikania w linki i możliwości przeoczenia ważnej dla użytkownika treści. Przykładem takiej strony jest firma Poliman.

nowa-fajna-strona-poliman

 

6. Opowiadanie historii – storytelling

Nową forma reklamy jest odejście od tradycyjnego informowania na rzecz interaktywnej opowieści. Wszystko ma zostać opisane, by wprowadzić użytkownika w świat marki, usługi, produktu. Formy snucia opowieści popularne są szczególnie na stronach promocyjnych i serwisach produktowych. Całość informacji zawarta jest na jednej stronie, która jedynie przewijamy w dół zapoznając się z opowiadaną nam historią.

storytelling

 

7. Media społecznościowe

Social media to duża część zysków wielu firm. Aby zyskać kolejne profity i użytkowników proponuje się zmianę przycisku call – to action na przycisk z opisem „podziel się” „udostępnij” zamiast obecnej formy „kup” i „dodaj do koszyka”. Korzystnie w dotarciu do kolejnych użytkowników jest to z prostego powodu. Osoba klikająca i udostępniająca naszą usługę sprawi, że zobaczy to wielu jej znajomych, co zwiększa prawdopodobieństwo dokonania zakupu także przez nich. A kto chce i jest zdecydowany na zakup i tak go kupi.

hands-woman-laptop-notebook

 

8. Video i multimedia

Kolejnym niezwykle szybko rozwijającym się trendem w Sieci jet poza dużym zdjęciem duże video! Zdjęcie i obraz znacznie bardziej niż suchy tekst angażują odbiorcę, jednak jeśli faktycznie zależy nam na pełnym zaangażowaniu osób odwiedzających witrynę sięgnijmy po sprawdzone rozwiązanie jakim jest film. Na popularności zyskują także ruchome tła strony.

wideo

 

Mam nadzieje, ze tymi poradami dotyczącymi najnowszych trendów budowania strony pomogłam i zainspirowałam Was do zmian. Zmian na lepsze, bo gwarantujące większą ilość zainteresowanych odwiedzających Waszą witrynę.


Jeśli dzięki naszym poradom stworzycie coś oryginalnego, podzielcie się tym z nami. A może Wy macie jakieś dodatkowe spostrzeżenia?? Piszcie.


 

Zobacz nasza propozycje CZTERECH DARMOWYCH NARZĘDZI DO TWORZENIA SZKICÓW. Sprawdziliśmy je osobiście.

Gdy już wiesz jak ważne by osiągnąć sukces jest planowanie swoich projektów (o czym pisaliśmy tutaj), czas zabrać się do roboty.

 

Z powodzeniem  możesz zabrać się za to na własną rękę, ale tylko jeśli:

  • wiesz czego chcesz
  • chcesz zaoszczędzić czas
  • masz konkretny pomysł i własną wizję
  • chcesz sam zająć się projektem

Natomiast nie do końca wiesz jak to wszystko złożyć w całość.

 

Zastanówmy się jakie narzędzie wybrać

Specjalnie dla was zebraliśmy kilka darmowych propozycji, które pomogą w tworzeniu szkicu. Nasze propozycje z pewnością przyśpieszą i ułatwią proces kreatywnego tworzenia wireframingu.

 

Przelewając pomysł na przysłowiowy papier gwarantujemy Ci, że:

  • dostaniesz przy jego wycenach konkretne oferty cenowe
  • skrócisz czas wyceny i rozmów na temat projektu
  • zyskasz na profesjonalizmie
  • podejmiesz trafniejsze decyzje,- nad wieloma sprawami będziesz mógł się zastanowić nie będąc pod presją czasu
  • zweryfikujesz jak Twoje pomysły wpisują się w rzeczywistość

 

Pomyślisz pewnie: Kartka i ołówek nie wystarczą?

Dla wielu doświadczonych osób z branży to wystarcza, ale jeżeli nie masz doświadczenia w projektowaniu program bardzo Ci pomoże, gdyż zawiera gotowe, najczęściej używane w projektach elementy.

 

Oto lista darmowych narzędzi które zostały przeznaczone do tworzenia szkiców:

 

Cacoo

Wystarczy się zarejestrować podając adres mailowy, na który przychodzi link aktywacyjny. Kolejnym  krokiem jest podanie: imienia i hasła. Et voila! Gotowe! No prawie… Musimy przełączyć się z zakładki „Pierwsze kroki” na „Diagramy” i kliknąć „Utwórz nowy”, wtedy pojawią się szablony pod komputery i aplikacje mobilne. (Po lewej stronie tego okna jest dużo więcej domyślnych elementów do wyboru, takich jak, np. kartki świąteczne.) Należy wybrać to, co nas interesuje i kliknąć „Select”. Narzędzie posiada dużo funkcji, a pliki za darmo można zapisać w png, co w zupełności wystarczy. Uwaga, jest ograniczenie w Cacoo do 25 projektów.

 

Cacoo

 

 

Gliffy

Przyjemniejszy dla oka niż poprzednik, ale przy pierwszym użyciu troszkę mniej wygodny. Do tworzenia szkicu nie jest potrzebne konto ale już do jego eksportu do png lub jpg tak. Należy podać imię, nazwisko, e-mail, hasło, ale nic nie trzeba potwierdzać, po rejestracji plik jest zapisywany na dysku komputera.

 

Giffy

 

Lumzy 

Wszystkie elementy zachowane w jednym stylu, który nie wszystkim może odpowiadać. Plusem jest to, iż narzędzie jest całkowicie darmowe, nie trzeba się logować czy rejestrować aby zapisać plik, jedynie co jakiś czas wyskakuje powiadomienie, które można wyłączyć i pracować dalej.

 

lumzy

 

MockFlow 

Rozbudowane i dopracowane graficznie. Za darmo możemy utworzyć tylko jeden projekt, ale za to jaki! Wybieramy projekt i określamy czego będzie dotyczyć. Tworzymy i dostajemy gotowy szablon do przerobienia. Bardzo duży wybór ładnych elementów, możliwość eksportu do pdf, a do rejestracji (na samym początku) należy podać imię, maila i hasło, nie trzeba potwierdzać konta.

 

MockFlow

 

Oczywiście szkice można tworzyć też w programach:

  • Adobe Illustrator
  • Adobe Photoshop
  • w programach takich jak Pencil

 

Z Adobe korzystamy my podczas tworzenia, ale jest to opcja dla zaawansowanych.

 

Tak wygląda przykładowy wireframe:

 

 

glowna

 

 

Dzięki tym programom w łatwy i szybki sposób zobrazujesz to co chcesz aby grafik lub agencja dla Ciebie wykonała. Proponowane przez nas programy możesz wykorzystać także w inny sposób np. do zaprojektowania:

 

  • prostej ulotki
  • ogłoszenia
  • grafiki do Twojej prezentacji

 


Podziel się z nami jak wykorzystałeś proponowane narzędzia. Zostaw komentarz jeżeli narzędzia okazały się pomocne! A jeśli stworzyłeś jakiś szkic, pochwal się, jesteśmy ciekawi dokonań naszych czytelników 🙂


 

Jeśli jesteś zainteresowany stworzeniem szkicu Twojej aplikacji czy portalu … czytaj dalej

 

Firma POLIMAN tworzy profesjonalne szkice oraz specyfikacje rozbudowanych portali i aplikacji. Jeżeli Twój projekt wymaga fachowego oka, skontaktuj się z nami info@poliman.pl, pomożemy!