Krytyka projektowania stron internetowych # 43: Abdominals at Work
Co tydzień przyglądamy się nowej stronie internetowej i analizujemy projekt. Wskażemy oba obszary, które są dobrze wykonane, oprócz tych, które mogą wymagać trochę pracy. Na koniec zakończymy prośbą o przekazanie własnej opinii.
Dzisiejszą krytyką jest Abdominals at Work, strona z aplikacjami na iPhone'a.
Przeglądaj zasoby projektowe
Jeśli chcesz zgłosić swoją stronę internetową, która będzie prezentowana w przyszłej krytyce projektowania, zajmuje to tylko kilka minut. Za krytykę twojego projektu pobieramy 34 USD - znacznie mniej niż zapłacisz za konsultanta, który zajrzy na Twoją stronę! Tutaj dowiesz sie więcej.
Informacje o aplikacji Abdominals at Work
„Pasywna metoda skurczów izometrycznych. Jeśli spędzasz dużo czasu przed komputerem lub telewizorem, możesz użyć tej metody do pracy mięśni brzucha podczas wykonywania innych zadań. Ty wybierasz czas i miejsce, a aplikacja nauczy Cię wykonywania ćwiczeń, dyskretnie zaznaczając rytm i intensywność poprzez wibracje lub melodię. ”
Oto zrzut ekranu strony głównej:
Pierwsze wrażenie
Moje początkowe przemyślenia na tej stronie były dość pozytywne. Podoba mi się ogólny wygląd witryny i jej ścisłe odzwierciedlenie w aplikacji. Scena z zachmurzonym niebem zdecydowanie nie sugeruje mi ćwiczeń, ale aplikacja jest trochę relaksująca, więc przypuszczam, że wszystko dobrze się łączy.
Kolory i grafika są dość przyjazne i tworzą przyjazne środowisko. Moim ulubionym aspektem jest to, jak prosta była ogólna zawartość: tylko iPhone z kilkoma zrzutami ekranu, krótki opis, kilka sposobów udostępniania i widoczny link do sklepu iTunes, gdzie można dowiedzieć się więcej i pobrać aplikację. Wystarczy, aby zainteresować Cię, nie przytłaczając.
Chociaż podoba mi się ogólny kierunek aplikacji, jak zwykle mam wiele sugestii dotyczących ulepszeń. Podzielmy określone obszary, aby zobaczyć, jakie pozytywne zmiany można wprowadzić.
Dźwięk
Każdy, kto kiedykolwiek przesłał do nas prośbę o krytykę projektu witryny zawierającej dźwięk, otrzymuje tę samą radę. Zawsze wolę, aby twórcy witryn dawali odwiedzającym opcję dodania dźwięku na początku, zamiast go zabierać. Przeglądanie stron internetowych jest zazwyczaj spokojnym doświadczeniem, a nagłe głośne dźwięki nie wywołują u gości gniewu.
Ta strona jest o wiele lepsza niż większość w tej dziedzinie. Chociaż dźwięk zaczyna się automatycznie, jest to przynajmniej dość spokojny i relaksujący motyw oceanu z ptakami i falami. Możesz także wyłączyć dźwięk, klikając ćwierkający obraz ptaka u dołu strony.
Mam na ten temat kilka przemyśleń. Najpierw musiałem przewinąć, aby go znaleźć (choć wprawdzie jestem na małym ekranie MacBooka). Jeśli ktoś odwiedza Twoją witrynę w pracy, bibliotece lub innym miejscu publicznym, nie chcesz, aby musiała się wspinać, ponieważ zawstydzająco próbuje znaleźć sposób, aby ją wyłączyć. Można by pomyśleć, że użytkownik po prostu nacisnąłby przycisk wyciszenia, ale częściej prawdopodobnie po prostu zamknie okno tak szybko, jak to możliwe.
Co więcej, zdecydowanie mogę zobaczyć, w jaki sposób ptak z wydobywającymi się z niego nutami sugeruje sterowanie dźwiękiem, ale ma niefortunne podobieństwo do linku do ptaka na Twitterze, tak jak teraz widzimy na prawie każdej stronie w Internecie. To sprawia, że nie jest od razu widoczne, że ptak jest kontrolą dźwięku, ponieważ nie ma tekstu, który wzmocniłby przekaz.
Prosta rada tutaj jest taka, że jeśli chcesz pozostać przy automatycznym odtwarzaniu dźwięku, umieść kontrolkę u góry strony i wyraźniej, co robi. Proponuję grafikę mewy (ptak Twittera nie pasuje do motywu oceanu) i komunikat „włącz / wyłącz dźwięk” w pobliżu ptaka. Ponadto zatrzymaj animację nuty, gdy strona jest wyciszona, i zacznij, gdy dźwięk jest włączony, zamiast kontynuować cały czas.
Animacja
Oprócz dźwięku strona ma kilka unoszących się chmur, które dryfują zarówno przed, jak i za treścią. To dodaje trochę zabawy stronie i jest, co prawda, ciekawsze niż grafika statyczna.
W większości chmury nie utrudniają użyteczności, ale czasami zakłócają czytelność tekstu. Ponadto, podobnie jak w przypadku każdej zapętlonej animacji, mogą stać się nieco monotonne, jeśli spędzisz tyle czasu, ile ja gapię się na stronie! Jednym z solidnych pomysłów, które widzieliśmy w naszej krytyce ToonyTuts, był prosty system kontrolny z dwoma ikonami do zatrzymywania muzyki i / lub animowanych chmur. Tematyka strony była bardzo podobna do dzisiejszej, więc myślę, że podobna kontrola działałaby tutaj idealnie.
Wiadomości i SMS
Myślę, że strona dobrze się spisuje, wyjaśniając, że omawiamy ćwiczenia brzucha. Jednak strona może wyglądać trochę technicznie, jeśli chodzi o tak zabawnie wyglądającą stronę. Zastanów się nad głównym nagłówkiem „Pasywna metoda skurczu izometrycznego”. To miłe i wzniosłe, ale tak naprawdę nie ma przyjaznego pierścienia, prawda?
Nie musisz porzucać tej wiadomości, ale może warto rozważyć włączenie jej do akapitu na rzecz bardziej interesującego nagłówka, takiego jak: „Zbuduj sześciopak podczas oglądania telewizji!” Nie jest to bynajmniej najlepszy przykład, ale stanowi sedno mojej sugestii. Nagłówek taki jak ten przyciąga cię i sprawia, że chcesz dowiedzieć się więcej, niż cię zniechęcać, ponieważ czujesz się głupio i nie masz pod ręką swojego tezaurusa.
Być może największym problemem, jaki mam z całą stroną, jest żółty tekst na niebieskim tle. Te dwa kolory kolidują ze sobą na małym tekście i bardzo utrudniają odczytanie tych informacji.
Problemem jest klasyczny konflikt vs. uzupełnienie w teorii kolorów. Kiedy dwa kolory po prostu nie są wystarczająco różne, mają tendencję do konfliktu ze sobą, szczególnie gdy jeden z nich jest umieszczony nad drugim. Rozważ poniższy przykład i o ile bardziej czytelny jest jaśniejszy, mniej nasycony żółty tekst niż wersja, która go poprzedza.
Teraz zdaję sobie sprawę, że w rzeczywistości są to kolory z twojej aplikacji, więc nie jest logiczne, aby zmieniać je na stronie. Proponuję zatem po prostu zeskrobać żółty nacisk na tekst i użyć czegoś innego, pogrubionego tekstu, podkreślenia itp., Co nie zakłóca czytelności.
iPhone
Grafika iPhone'a z pokazem slajdów jest bardzo popularna na stronach z aplikacjami na iPhone'a i nie bez powodu. Dzięki temu od razu widać, o co chodzi w witrynie. Myślę jednak, że można to nieco ulepszyć.
Na początek, małe kropki, które służą jako nawigacja pokazu slajdów, mają obracające się koło ładowania. Ta mała animacja nigdy się nie kończy, więc do czego służy? Gdy widzę, że się obraca, sugeruje to, że strona nie została załadowana (uczono nas, że to właśnie oznacza ta grafika), a gdy nigdy się nie kończy ładowanie, sprawia wrażenie, jakby witryna była zepsuta. Podsumowując, ta grafika jest rozpraszająca, myląca i nie ma praktycznego celu, usuń ją.
Co więcej, jako mała irytacja, maniak Apple we mnie nie może nie zauważyć, że obraz iPhone'a jest nieaktualny. IPhone 5 jest już blisko, a na tej stronie wciąż nie ma grafiki iPhone'a 4. Wiem, że nadążanie za tym jest absurdalne, ale ponieważ strona jest przeznaczona dla aplikacji na iPhone'a, może to być ważne. Nieaktualne zdjęcia sprawiają, że sama aplikacja wydaje się stara i przestarzała, co sprawia, że zastanawiam się dwa razy, zanim ją kupię!
Nawigacja
Ostatnia myśl o tej stronie jest taka, że nawigacja wydaje się być późniejszą refleksją. Zawiera linki, które zmieniają treść tekstową na stronie z informacjami istotnymi dla odwiedzających, ale z jakiegoś powodu jest to małe i ukryte w stopce.
Gdyby to było naprawdę coś drobnego, nie miałbym nic przeciwko, ale w rzeczywistości wydaje się to ważniejsze, niż projektant to przyznał. Najprostszym rozwiązaniem jest wrzucenie go w typowe miejsce na samej górze strony i nieznaczne powiększenie tekstu.
Twoja kolej!
Teraz, gdy przeczytałeś moje komentarze, dołącz i pomóż, udzielając projektantowi dalszych rad. Daj nam znać, co Twoim zdaniem jest świetne w tym projekcie i co Twoim zdaniem może być mocniejsze. Jak zawsze prosimy, abyście szanowali również projektanta strony i oferowali jasne konstruktywne porady, pozbawione jakichkolwiek ostrych zniewag.