Дизајнирање фокусираних интерфејса за боље ангажовање корисника

Ангажовање корисника је сложена метрика која се може постићи на различите начине за различите пројекте. Већина дизајнера мисли на интерфејс када говоре о интерактивности, али садржај странице такође може подстаћи интеракцију корисника. За боље ангажовање корисника важно је написати занимљив садржај, и представите тај садржај у привлачном дизајну.

Много је лакше рећи него урадити, али ако научите неке основе, нећете имати проблема са прављењем а фокусиран УИ са великим садржајем за ваше пројекте.

У овом посту, показат ћу вам како се повећава интеракција корисника и ангажовање садржаја на веб-базираним интерфејсима. Ово су два најчешћа начина за ангажовање посетиоца, и ако можете оптимизујте искуство нећете имати проблема са повећањем тог уносног времена на метричкој страници.

Цаптуре Новелти

Концепт новина дефинише догађај или ствар која је генерално нова, често веома нова и јединствена на основу контекста. Новел евентс ухватите нашу пажњу зато што они истичу. Ово важи и за дизајн интерфејса са новостима које представљају елементе који се чине скочити са странице.

Недавно сам нашао одличан пост о важности новости када је у питању ангажман. Корисници изгледа тежити ка новим искуствима, интерфејсима и елементима корисничког интерфејса јер су другачији. Сама чињеница да је дизајнирана другачије често привлачи пажњу.

Један од уобичајених примера је дугме позива на акцију које се налази на већини одредишних страница. Такође можете изградити новитет са позадинске фотографије, илустрације или сцреенсхотови апликација, као што је на одредишној страници Убер фор Бусинесс.

Ова страница има дугме позива на акцију, али моја пажња одмах иде на сцреенсхотове. Они анимирају када се први пут учитају, тако да се то комбинује новина дизајна са покретом да привуку пажњу.

Алтернатива би била коришћење ГифтРоцкет-а илустроване иконе као линкови да пређете даље на сајт.

Оба ова примера користити новину у своју корист. Не можете увек привући људе даље на сајт, али ћете видети боље резултате ако их привучете на висцералном нивоу први.

Дизајн је Прва ствар посетиоци виде, а ви морате да привучете њихову пажњу за неколико секунди да подстакне даље ангажовање.

Скиммабле Типограпхи

Студије су откриле да већина корисника сцан а вебпаге радије него да је читају по ријеч. Вероватно ћете желети да привучете људе да читају ваш садржај, али то можете учинити само много.

Најбоља алтернатива је створити скиммабле цонтент са насловима, подебљаним текстом и сликама које илуструју оно што покушавате да кажете. Могу се барем сјетити три моћне технике писања можете користити у свом садржају повећати читљивост:

1. Дивиде цонтент са јасним титловима
2. Бреак уп параграфи да би их смањили
3. Користите листе са ознакама да бисте брже делили своје поене

Циљ је задржати читаоце померањем странице било којим средствима. Чувајући садржај малим у комадима величине угриза имат ћете много лакше вријеме да привучете пажњу и возите људе даље на веб-локацију.

Погледајте блог Куицк Спроут за пример овог стила писања. Садржај је написао Неил Пател и често пише веома дугачак садржај, али он обара параграфе у 1-3 реченице.

Ако имате одговарајуће наслове, и користити имагес / буллет поинтс током читавог садржаја људи ће се још више скимирати и читати. Такође будите сигурни повећајте количину празног простора између пасуса. Маргине и паддингс оба играју велику улогу у дизајну изгледа и читљивости.

Дизајнирајте текст тако да буде у ствари забавно за читање. Досадна копија неће привући, али ни забавна копија је премала или нема контраст.

Еие-Цатцхинг Имагес

Недавна студија случаја Бацклинка предлаже да се те странице са најмање једном сликом обично чин виши од страница без слика. Ово је сјајно са СЕО перспективе.

Али шта је са ангажовањем корисника? Ако можете задржати ту слику изнад прелома или близу врха такође ће привући пажњу посетилаца пре одбијања. Запамтите да нови елементи странице привлаче.

Када имате слику (или много слика) која је испресијецана по цијелој страници, моћи ћете разбити монотонију досадних текстуалних блокова. Корисници могу направите паузу од читања цијенити слику, или направити везу између слике и писаног садржаја. Али, као и код већине дизајнерских техника, квалитет је вреднији од количине.

Студија случаја Моз открила је да слике високог квалитета имају тенденцију задржи посетиоце на страници дуже. С друге стране, слике лошег квалитета не ради добро у неким случајевима су изазвали посетиоце боунце брже него без слика. Покушајте да укључите бар једну слику која је релевантни за садржај и то даје вредност читаоцу.

ТецхЦрунцх ово ради са истакнутим сликама у својим чланцима где ћете често наћи а истакнута фотографија изнад прегиба.

ВордПресс олакшава додавање истакнутих слика помоћу функције сличице поста. Можете поставити засебну фотографију за сваки пост који напишете и приморати их да се појаве на врху странице. Ово је савршен начин да посетиоци погледају о чему се ради, и да се повећа ЦТР за сличне пост видгет-е који такође садрже сличицу поста.

Контрастни елементи странице

Ако желите да скренете пажњу на једну одређену област на страници онда асиметрија је твој најбољи друг. Контраст покреће тврди клин између одређених области дизајна или одређених блокова садржаја.

Посетилац је природно равити према контрасту јер је другачије. Велике јукстапозиције боја, величине или размака привлаче око зато што је то прекида све остало у распореду.

Мој омиљени пример за контрастирање елемената странице је можда почетна страница Скетцх-а. Постоји много контраста између два позива на акцију, један за преузимање Скетцх суђења, а други за куповину копије.

Дугме за куповину користи пуну позадинску боју много светлија од осталих боја у заглављу. Текст дугмета је такође светлији у поређењу са дугметом за бесплатну пробу. То доводи посетиоце до дугмета "Купи одмах" искључиво из визуелних стимуланса.

Приметићете слична техника на почетној страници Оптин Монстер. Овај заглавље има само једно дугме са ознаком Гет ОптинМонстер Нов. То је светло зелено дугме на плавој позадини без других зелених елемената на видику.

Боја, величина и облик привлаче вашу пажњу због тога контрастира са свим осталим у заглављу. Непосредно поред дугмета налази се мала текстуална веза за преглед видео записа. То је вероватно одличан видео и заслужује пажњу, али не онолико колико је ЦТА дугме пробно / пријављено.

За блог можете имати различите квалификације за ангажовање корисника. Један од уобичајених избора је а формулар за пријаву на невслеттер као што је пример о Аеолидији.

Ако се померите надоле до дна садржаја који ћете приметити а кутија за пријаву фанци-схманци дизајниран само за формулар за билтен. Истиче се од остатка странице јединствена боја позадине, забавна типографија и слатка икона Кинг Тритон.

Најбољи начин за дизајнирање контраста је проучавање примера и само експериментисање. Погледајте шта ради, а шта не праћење метрика са А / Б тестирањем. Ако тражите још примера, проверите овај Цодропов запис пун савета и екрана живих асиметричних веб страница.

Подстакните интеракцију корисника

Постоји толико много начина да посетиоци буду заинтересовани за неки сајт, али најчешће је то нека раде ствари. Ово важи и за статичке блогове и за динамичке друштвене локације. За ово нема никаквих трикова. Можете урадити све што је потребно да бисте направили кориснике осећате да сте укључени у страницу.

Ин а статиц сите, можете додати много Сродне везе за читање више или укључивање имаге слидесховс. Можете такође адд формс за коментаре корисника или е-билтен.

Када је у питању динамички интерфејси, сврха сајта је обично да подстакне ангажовање корисника. Највећа препрека је наставни корисници како сајт функционише и како се правилно укључити у интерфејс.

Погледајте овај пост од КиссМетрицс-а који говори о техникама ангажовања корисника. Једна од најбољих стратегија коју сам пронашао је осмислите обилазак са водичем што доводи посетиоце сваку од основних функција.

Размислите како би збуњујућа перспектива Твиттера била потпуно нови корисник. Ако не прате никога и немају следбенике, зашто би твеетали?

Тхе “Пратите предлоге” у току регистрације помаже новим корисницима упознајте се са начином на који Твиттер ради. Ова особина подразумијева нове кориснике старт енгагинг са платформом и на експериментишите са функцијама као што следи, твеетс и приватне поруке.

Осим вођене туре коју ћете желети чини интерфејс јасним. Главне особине би требале бити 1-2 кликова са контролне табле или главне странице корисника. Интуитивни интерфејси потребно објашњење, и једноставност хвата пажњу много брже.

Разумевањем свих ових техника, лакше ћете изградити интерфејсе решавање проблема корисника, и охрабрите нове кориснике да се придруже. Ако тражите више Савјети за УКС дизајн погледајте ове повезане постове:

• Тактика за укључивање корисника (тхинкаппс.цом)
• Лекција у постепеном ангажовању (укбоотх.цом)
• Немојте претпостављати да нови корисници желе да науче како да користе ваш производ (укдесигн.цц)