Специална критика за уеб дизайн: Новият Google+
Вчера Google внедри мащабен редизайн на социалната си мрежа Google+. Те не просто се разбъркваха около няколко обекта, те предефинираха изцяло визуалното изживяване. Такова голямо обновяване заслужава специално издание на нашата серия от критики за уеб дизайн.
Нека другите говорят за скучни стари списъци с функции, присъединете се към нас, докато влезем и се огледаме, за да видим какво е по-добро и кое е по-лошо от гледна точка на дизайнера. Ще вземем отделно всяко парче от интерфейса и ще видим дали има какво да научим.
Разгледайте дизайнерските ресурси
Ако искате да изпратите уебсайта си, за да бъде представен в бъдеща дизайнерска критика, отнема само няколко минути. Ние таксуваме $ 49 за критикуване на вашия дизайн - значително по-малко, отколкото бихте платили за консултант, който да разгледа вашия сайт! Можете да разберете повече тук.
Старият Google+
Преди да се потопим в новия дизайн, нека да разгледаме накратко оригиналната версия на Google+, показана по-долу.
Както можете да видите, това е доста оскъдно изживяване с много бяло пространство. Оформлението организира съдържанието в три колони с хоризонтална лента по върха за търсене, добавяне на снимки, разглеждане на вашите кръгове и др. Оформлението тук всъщност напомня на текущия дизайн на Facebook.
Цялостното усещане е чисто и просто, но и малко студено и безлично. Това направи сайта лесно за всеки, който може да вземе и използва, но може би не помогна много с концепцията да направи страницата свой личен център за комуникация.
Новият Google+
Новият Google+ драстично намалява бялото пространство и усещането за оскъдица. За сравнение интерфейсът изглежда зареден с функции и бутони. Те запазиха силната бяла индивидуалност, но допълниха това с нюанс на сивото.
Това може да изглежда като тривиална промяна, но всъщност е много умишлен опит за създаване на силна визуална йерархия на страницата. Където старата страница беше бяло море с единична зона сиво по върха, тази страница използва тези два цвята за ясно разграничаване на първичната и вторичната част на съдържанието. Очите ви ще плуват около страницата, като дават ключово значение на по-леките части на интерфейса.
оформление
Този път оформлението е много по-сложно. Това е модифицирана версия на старото оформление на три колони с малко гнездене на място. Все още има широка основна секция, обградена от две тесни странични ленти, но тази основна част е разделена на две силни подколони. Цялото съдържание на страницата има фиксирана позиция, само основната област на съдържание се превърта.
Ако премахнем всичко и просто погледнем костите на страницата, виждаме доста сложна телена рамка.
Една от най-съществените концептуални промени, която се случи, е, че старото оформление съдържа различни ваши приятелски кръгове във вертикална лента надолу от лявата страна и вашите навигационни икони в горната част, докато новото оформление поставя навигацията във вертикална лента от икони надолу от лявата страна и кръговете ви в хоризонтална лента отгоре.
Този ляв страничен модел на навигация на икони е нещо, което стана изключително популярно в дизайна на Mac UI и започваме да го виждаме огледално в уеб интерфейсите. Един от най-значимите привърженици на този формат беше Twitter за Mac (преди Tweetie), който породи множество подобни интерфейси в приложения като Reeder, Sparrow и Raven.
Новата страница в Google+ идва с лексика, която трябва да научите. Лентата надолу от лявата страна е „лентата“, която съдържа различни „приложения“. Основното поле за съдържание е „картата”, а областта на изплъзване под всяка публикация с коментари, +1 и т.н. е „чекмеджето за дейности”.
Проблеми на привеждане в съответствие
Новото оформление отива доста далеч към това, че Google+ изглежда като по-богато на функции приложение и определено добре използва контраст, за да подчертае важните части на страницата. Всъщност нямам проблеми с цялостната схема на оформление, но не мога да не забележа някои проблеми с подравняването, които според мен разрушават естетическото.
За начало полето за основно съдържание и бутона за разговор са в рамките на няколко пиксела, за да бъдат перфектно подравнени по горните им щрихи. За съжаление, до нитрик като мен, няколко пиксела се усеща на миля. Малко са дизайнерските измислици, които ме дразнят по-бързо от две неща, които са почти изравнени. За да научите повече по тази тема, вижте „Защо почти е мръсна дума в дизайна.“
Ефектът е още по-лош, ако направите крачка назад и разгледате всичките четири елемента в тази област. Потребителският имейл адрес, полето за първично съдържание, полето за разговори и областта за уведомяване изскачат на произволни дължини и изглежда нямат логика зад тяхното разположение.
Този пример не е изолиран инцидент, има няколко други случая, при които обектите просто пропускат вертикално или хоризонтално подравняване. Вижте как логото на Google+ по-долу е неудобно изместено от силната вертикална линия, установена от навигацията по-долу.
Дизайн на икони: По-нататък от прости
В исторически план Google винаги е бил известен с пълната си липса на дизайн. Всеки разгърнат продукт изглеждаше почти най-простото възможно решение, което можете да си представите. Имиджът на марката Google представлява пълен отказ да се следва лъскавия и нагърен визуален стил web 2.0, популярен в началото на 2000-те години, в полза на това съдържание да говори само за себе си.
През последните години видяхме, че Google започва бавно да се дистанцира от тези идеи, тъй като продуктите му показват фина, но все по-голяма сложност и детайлност в дизайна. Иконите в новия Google+ служат като перфектен пример за това понятие.
Забележете как простите абстрактни форми и плътните цветове са отстъпили на едно по-сплотено изображение на къща, което съдържа фини щрихи и градиенти.
Повторение на ефекти на Hover
Докато сме на темата за иконите, нека разгледаме набързо някои от незначителните аспекти на взаимодействие на сайта, а именно ефектите на курсора. Общата тема тук е, че иконите са сиви и контрастират много малко с фона. След това, когато задържите курсора, иконата придобива пълен цвят. Можете да видите това в действие на страничната лента:
Повторението е един от най-силните ви инструменти като дизайнер и Google го владее добре тук. Същият ефект в сив цвят се повтаря на още няколко места в цялата страница.
Те обаче са малко несъвместими с този ефект. Има няколко петна, където мисля, че би било уместно да продължите повторението, но те избраха да продължат с друг случаен ефект. В примера по-долу иконите се превръщат във форми на бутони при задържане.
Нова странична лента
Вдясно от основната секция за съдържание има нова странична лента с различни функции, предназначени да ви помогнат да използвате максимално Google+. Обърнете внимание, че това е друго място, където виждаме цвета при ховър трик.
Тази област е много добре проектирана, като всеки раздел е ясно организиран и обособен. Интересно е да видите как Google взема идея от Twitter под формата на списък с актуални теми. Можете да видите, че потребителите вече възприемат синтаксиса на хештега, завладяващ пример за това как автоматично прехвърляме поведението си в социалните мрежи, независимо дали разработчиците отчитат това или не.
Винаги е важно както да предвиждате, така и да наблюдавате внимателно поведението на вашата потребителска база и да се грижите за действия, към които те сякаш гравитират, а не да се опитват да ги променят. Това ще направи вашата платформа да изглежда много по-интуитивна и лесна за възприемане.
Профил
Взимайки страница от новата книга за възпроизвеждане на времевата линия във Facebook (и може би Path), новият профил в Google+ позволява не само изображение на главен аватар, но и „изображение на корицата“ (същия термин, използван от Facebook).
Частта, която е забележимо откъсване от Facebook, е безспорно огромната снимка на профила, която стои от дясната страна, вместо отляво. Показани по-долу в действителни размери, тези изображения се показват с огромни 250px на 250px, което със сигурност не е случайно точно двойно снимки на 125px във Facebook с квадратен профил.
Едно нещо, което ми е интересно, е фактът, че изображението на корицата всъщност избухва от основното поле за съдържание. Обикновено го оценявам, когато дизайнерите умишлено изтеглят неочакван трик като този, но за да бъда честен, го намирам за доста разсейващ. Веднага щом страницата на профила се зареди, очите ми скачат право към неудобното припокриване.
Каква е присъдата?
От миналия месец, според съобщенията, Google+ е прекрачил 100 милиона марки за активни потребители. Никой не може да нарече това малко число, особено предвид факта, че Instagram просто грабна милиард долара от Facebook за своята платформа и 30 милиона + потребителска база.
Освен това, ако имате предвид, че Twitter има само 140 милиона активни потребители, изглежда, че Google+ бързо се стреми към слот номер 2 в социалните медии. Това обаче определено не е достатъчно, за да се доближи до конкуренцията на активната потребителска база на Facebook, която е някъде в обхвата от 800 милиона.
Новият дизайн показва, че Google няма намерение да изоставя този проект, както са имали толкова много други в миналото. Определено се опитват да създадат по-приятно изживяване, за да ви примамят и да ви накарат да се връщате. Въпросът е дали ще работи?
За да отговорим на това, трябва да спекулираме какво пречи на хората да приемат Google+. Очевидният отговор е, че Google+ се чувства малко излишен, когато вече имате акаунт във Facebook, още повече, ако сте активни и във Facebook, и в Twitter. Друга възможност е, че докато старият Google+ със сигурност не беше грозен, той наистина се чувстваше малко стерилен и лишен от личност.
Възможни цели зад новия дизайн
От това можем да измислим предположение за поне две възможни цели зад редизайн. Първият ще бъде по-нататъшното разграничаване на Google+ от другите социални мрежи. Опитвайки се да твърдят, че те са просто по-добри от Facebook в собствената си игра, не е най-добрият вариант, хората в Google трябва да установят ясно уникален идеен крайъгълен камък за това защо хората трябва да дойдат на сайта им. Като пример, Twitter свърши отлична работа, като се държи далеч от възпроизвеждането на функционалността на Facebook и не стои като алтернатива, а като свой собствен продукт.
Втората цел би била да се намали стерилността и да се започне трансформацията на Google+ в приятелско, приветливо място, което е лесно за навигация и дори забавно за използване.
Те постигнаха ли тези цели?
Ако анализираме дизайна по отношение на тези цели, можем по-добре да преценим дали успехът е или не. Това упражнение ни дава ясни точки да сравним, а не сляпо да намушкваме в тъмното в опит да намерим какво работи и какво не.
Що се отнася до първата цел, Google постигна известен напредък в някои области и може би отстъпи малко в други. Като цяло новото оформление е много по-далечен скок от Facebook от старото. На пръв поглед, верният потребител на единия никога не би сбъркал един за друг, което е добро нещо.
Освен това, малките докосвания, като поставянето на кръговите филтри в горната част и продължаването да дава известност на терена, гарантират, че малкото иновации на Google са отпред и в центъра. Този напредък е в контраст с други области като новия образ на корицата, които всъщност правят социалната мрежа да се чувства по- скоро като клон на Facebook, а не по-малко. Бих искал да ги видя как показват някаква уникална мисъл в тази област, а не просто да заемат новия формат на Facebook.
Втората цел определено изглежда е била основна грижа при обновяването на дизайна. Новият Google+ създава по-привлекателна среда. Макар че може би е на ръба да ви е затрупано, особено в сравнение със старата версия, това се чувства като по-здрава услуга с всички неща, които се случват на вашата начална страница.
Има много по-голям акцент върху лицата. Започва с огромната ви нова снимка на профила и продължава през началната страница, където виждате голяма странична лента за чат, пълна с приятелски лица, в допълнение към предложения за хора, които може би познавате и потребители, които може да харесате. Google иска да се сприятелиш, да се вдъхнеш в преживяването достатъчно, за да го пропуснеш, когато си отидеш. Повече приятели означава повече взаимодействия, което означава повече причини да се върнете.
Какво мислиш?
Google+ ми се стори, че през последните месеци излиза извън светлината на прожекторите. Това възприятие обаче беше очевидно недостатъчно, тъй като в действителност те тихо, но стабилно се изкачваха на класациите с впечатляващ брой активни ежедневни потребители. Независимо, че дори и да започнат да се оттеглят от обществен интерес, новият дизайн беше подбран перфектно, за да накара цялата мрежа да говори за тях отново. Дори ако това беше единствената причина за опресняването, тя вероятно ще се изплати.
Както обаче обясних по-горе, мисля, че тук са работили някои по-дълбоки цели. Сега, когато прочетохте мислите ми, време е да скочите в разговора. Какви цели смятате, че Google се опитваше да постигне с новия дизайн? Ефективно ли оттеглиха тези намерения?
Освен това Google+ ли е в крайна сметка обречен да върви по пътя на Wave, Buzz и други неуспешни социални опити или ще продължи стабилния си растеж и ще се превърне в една от най-важните социални мрежи в мрежата?
