A primer on Per­for­mance UX

Wez May­nard re­veals what you need to know in or­der to put per­for­mance at the heart of your UX strat­egy

net magazine - - CONTENTS - Wez May­nard job: Head of per­for­mance UX and dig­i­tal prod­uct, Ver­ti­cal Leap ar­eas of ex­per­tise: UX, de­sign, strat­egy w: wez­may­nard.com t: @wez

Wez May­nard re­veals what you need to know in or­der to put per­for­mance at the heart of your UX strat­egy

The aim of this ar­ti­cle is to pro­vide an in­tro­duc­tion to per­for­mance UX and help you un­der­stand its three core pil­lars. I’ll delve into a bit of his­tory and let you know where the need for per­for­mance UX ini­tially came from and how it can get clients bought into (and un­der­stand­ing) UX. Lastly, I’ll show you how to pro­duce three per­for­mance UX tac­ti­cal de­liv­er­ables to help map your on­go­ing strat­egy. Per­for­mance UX is a per­fect so­lu­tion for those of you who work on web­sites that are al­ready live.

UX (within ser­vice de­liv­ery) has been at the heart of the most suc­cess­ful cus­tomer-cen­tric busi­nesses for many years. A decade or so ago the mid mar­ket started tak­ing UX se­ri­ously and the re­sults have been ex­actly what those al­ready in the field thought they would be: ex­cep­tional. A study from pointsource.com found that for ev­ery $2 spent

on UX-re­lated ac­tiv­i­ties, $2 to $100 was yielded in re­turn ( https://www.im­pactbnd.com/blog/the-busi­ness

value-of-ux-de­sign). Again, for many this is as far away from new in­for­ma­tion as you are likely to see.

Right here, right now, it re­ally doesn’t feel like those of us with a UX cap need to be back­wards in com­ing for­wards with new think­ing and in­no­va­tive ways of im­prov­ing the ex­pe­ri­ence of our clients and our clients’ cus­tomers. The dig­i­tal mar­ket fig­ures sup­port UX as a vi­able so­lu­tion to achieve ROI. UX has be­come a bread and but­ter ser­vice of­fer­ing for agen­cies.

So be­ing a UX prac­ti­tioner is bril­liant and all of our clients think we’re some kind of dig­i­tal Dalai Lama, right?

No. It cer­tainly wasn’t this way for me, not for a long time.

The eUXreka mo­ment

UX, for me, isn’t some­thing that ever fin­ishes. It is an on­go­ing process, not a one-off project that has a start and end date. Within an agency, this think­ing fits very nicely into a re­cur­ring (month-on-month) ser­vices model. I had long been an ad­vo­cate of lean UX – it’s re­ally the most ap­pro­pri­ate means of de­liv­ery in a fast-paced, multi-client agency en­vi­ron­ment. My whole dig­i­tal prod­uct ap­proach was al­ready based on it­er­a­tive cy­cles us­ing ag­ile/ sprints, which helps to keep progress mov­ing for­ward. Lastly, the part of me ob­sessed with clean code and op­ti­mis­ing for search mar­ket­ing needed to min­imise bloat, keep things nice and stream­lined as well as be­ing fu­ture ready. Blend­ing all these as­pects to­gether with UX tac­tics and strat­egy, it felt like I was on to some­thing.

I put to­gether an ini­tial pro­gram of on­go­ing de­liv­ery that I called ‘User Ex­pe­ri­ence Op­ti­mi­sa­tion’. It flopped. The re­sults were good but prospects (more of­ten than not) sim­ply didn’t un­der­stand it and didn’t take it on. A month or so passed with slow progress un­til a wise Texan took me to one side and sug­gested I changed the name to ‘Per­for­mance UX’. He the­o­rised that busi­nesses un­der­stood per­for­mance and al­ready wanted help in mak­ing per­for­mance bet­ter.

He wasn’t wrong. The de­liv­ery pro­gram didn’t change at all. Just the name. Ser­vice growth im­me­di­ately surged.

So how can per­for­mance UX build on the al­ready solid foun­da­tions es­tab­lished in the UX mar­ket­place? To put it ba­si­cally, it just re­quires a slight tweak to the per­spec­tive.

Mov­ing from ROI to per­for­mance

When talk­ing about UX, we can some­times shy away from talk­ing about cold hard cash. In my ex­pe­ri­ence, the client wants to know what UX means in terms of ROI or how long the UX project will take be­fore they see re­sults on their bot­tom line. Some­times this can be im­pos­si­ble to quan­tify un­til the ac­tual work starts. We need to move the con­ver­sa­tion away from

“UX has been at the heart of the most suc­cess­ful cus­tomer­centric busi­nesses for many years”

money and in­stead fo­cus on per­for­mance, namely: tech­ni­cal, ex­pe­ri­en­tial and com­mer­cial per­for­mance. The three pil­lars of per­for­mance UX. These are tan­gi­ble ar­eas with the abil­ity to bench­mark and demon­strate progress.

get to know The three pil­lars of per­for­mance UX

Tech­ni­cal per­for­mance is all about clear­ing im­ped­i­ments and en­abling your dig­i­tal prod­uct to be the best it can be. You could have the best look­ing web­site on the mar­ket but if it’s slow or not util­is­ing the lat­est tech­nolo­gies, it wouldn’t take much for it to be quickly left be­hind.

Ex­pe­ri­en­tial per­for­mance means un­der­stand­ing who your users are, what you want them to do on your site and be­ing able to di­ag­nose what they are ac­tu­ally do­ing.

Com­mer­cial per­for­mance re­quires you to be­come your client and un­der­stand their needs and the needs of the busi­ness. Know­ing what each con­ver­sion, sale or in­ter­ac­tion means to your client will help you pri­ori­tise your work and en­sure you’re re­port­ing on what’s im­por­tant to them

By sep­a­rat­ing the process into three core ar­eas, you are help­ing the client un­der­stand that im­prov­ing dig­i­tal ex­pe­ri­ence can be tan­gi­ble – but these ar­eas must work to­gether to achieve the best re­sults.

Who can do per­for­mance UX?

I’ve found that the best UX pro­fes­sion­als I’ve met have a var­ied skill set – it’s al­most a given if you’ve worked in UX for any length of time. The ma­jor­ity started in dif­fer­ent ar­eas and moved into user ex­pe­ri­ence later in life. This var­ied ex­pe­ri­ence makes an ideal per­for­mance UX cam­paign de­liv­ery man­ager. Per­for­mance UX works best when you can cover – by your­self or with a team – de­sign, strat­egy, data anal­y­sis, code, project man­age­ment and most im­por­tantly, ex­cel­lent com­mu­ni­ca­tion.

Start­ing your first per­for­mance UX sprint

This sprint is about un­der­stand­ing and bench­mark­ing. Un­der­stand­ing your client should be the first step with ev­ery new dig­i­tal cam­paign – but that doesn’t mean it should be un­der­rated. Hold a kick-off meet­ing with your client and con­duct

a stake­holder in­ter­view. You’ll need to in­ter­view who­ever will be eval­u­at­ing your work and, if you can, who­ever eval­u­ates their work. You need to learn about their busi­ness, what’s im­por­tant to them and what they ex­pect from you (this works whether you’re in-house or from an agency). These in­ter­views are in­te­gral when it comes time to plan your strate­gic UX roadmap later.

For those un­aware, a sprint is a mea­sure of time. You set a list of tasks you be­lieve you can achieve in your sprint and then re­port to your client at the end. In this ex­am­ple, my client has four days a month of per­for­mance UX. In this first sprint, I’ll spread two days’ worth of time over two weeks. As a re­cur­ring ser­vice this means we have at least three client touch points each month. One at the start of the first sprint, one at the end of the first (and start of the sec­ond) and one at the end of the sec­ond sprint.

In this sprint we’ll de­liver a tech­ni­cal di­ag­nos­tics au­dit, ex­pe­ri­en­tial jour­ney anal­y­sis and com­mer­cial goal re­view to our client. These doc­u­ments will form the back­log for on­go­ing per­for­mance UX work.

Tech­ni­cal di­ag­nos­tics au­dit

Tech­ni­cal per­for­mance es­sen­tially boils down to speed. How quickly can the user find the site (in search)? How fast is your dig­i­tal prod­uct in giv­ing the user what they want? And how ac­ces­si­ble is it? Although speed has been used in search rank­ing for some time, it was fo­cused on desk­top searches. This year, Google an­nounced page speed will be a rank­ing fac­tor for mo­bile searches. This now makes tech­ni­cal web­site per­for­mance more im­por­tant than ever.

In or­der to di­ag­nose the cur­rent state of tech­ni­cal per­for­mance, we need to gather bench­mark data. We’ll use three sources of data that are all free. You’ll want to run your client’s site through: PageSpeed In­sights ( https://de­vel­op­ers.google.com/speed/ pagespeed/in­sights/), GTmetrix ( https://gtmetrix.com/) and Light­house ( https://de­vel­op­ers.google.com/web/ tools/light­house/). For the lat­ter you’ll want to run all re­ports ex­cept the pro­gres­sive web app one. To com­pile your find­ings, you should pro­vide an ex­ec­u­tive sum­mary of why you are con­duct­ing the au­dit (bench­mark­ing) and show the scores

“In or­der to di­ag­nose the cur­rent state of tech­ni­cal per­for­mance, we need to gather bench­mark data”

“You should take notes about the way users nav­i­gate through the site and the se­quence of pages they take”

from the three sources up front. You should ide­ally ex­plain to the client what each source looks at and why you chose it. For the rest of the au­dit, com­pile the rec­om­men­da­tions from the three tools into chap­ters with num­bered lists of rec­om­men­da­tions. Your chap­ters should be: ba­sic site setup, speed and per­for­mance, ac­ces­si­bil­ity and SEO. The chap­ters form themes you can use in the com­ing months and the num­bers will en­able you and the client to re­fer to line items dur­ing dis­cus­sions. All of these el­e­ments di­rectly af­fect the user and be­ing able to talk about them is ab­so­lutely es­sen­tial to be­ing a user ad­vo­cate to your client.

Ex­pe­ri­en­tial jour­ney anal­y­sis

In or­der to show how we’ve im­proved the ex­pe­ri­ence for the user, we record how users are cur­rently us­ing the site. We’ll do this us­ing two in­dus­try-stan­dard tools: Hot­jar ( https://www.hot­jar.com/) and Google An­a­lyt­ics ( https://an­a­lyt­ics.google.com/). Sign up for Hot­jar and get the track­ing on your client’s site as soon as pos­si­ble, ide­ally be­fore this sprint starts. Once the code is in­stalled, log in to Hot­jar and ac­ti­vate Record­ings – on the free plan you’ll get 100 ses­sions, which is more than enough. Make sure you se­lect ses­sions that in­clude click­ing and scrolling and that you en­sure it’s only record­ing ses­sions of over 30 sec­onds.

Once you’ve amassed a good few ses­sions, sort by the #pages col­umn (high to low) and re­view what’s been recorded. You should take notes about the way users nav­i­gate through the site and the se­quence of pages they take. Ten to 20 videos of three or more pages should give you a good feel of how users are mov­ing through their jour­ney. You should doc­u­ment these jour­neys, pulling out any in­for­ma­tion of note (users ig­nor­ing CTAs, not us­ing the menu you thought they would, us­ing the site search, etc).

Next, within your client’s Google An­a­lyt­ics, nav­i­gate to the Be­hav­iour>Site con­tent>All pages ta­ble. Set the date range for the last three months and make sure you’re sort­ing by page views. What we’re go­ing to do now is show our client how users move through the site most of the time.

Take the top ten pages for page views. For each of these click on their URL in the ta­ble. This takes you to the page level screen and the graph will only show vis­its for that one page. Click on the tab that says Nav­i­ga­tion Sum­mary, found above the graph in the top-left cor­ner – it’s next to the one al­ready se­lected that says Ex­plorer. This nav­i­ga­tion sum­mary screen shows you which page users were on be­fore the page you se­lected and use­fully, where it was that they went af­ter­wards. You should record this data for each of your client’s top-per­form­ing pages (ten is a good num­ber to start with).

Col­late these find­ings in a doc­u­ment for your client and be sure to in­clude a sec­tion where you note down any­thing of in­ter­est. You will re­fer to this doc­u­ment a lot in the com­ing months when jus­ti­fy­ing hy­pothe­ses or demon­strat­ing jour­ney im­prove­ments, for ex­am­ple ‘this page used to ac­count for four per cent of vis­its to the demo sign up; my work on im­prov­ing mes­sag­ing/lay­out has in­creased this to eight per cent’.

Com­mer­cial goal re­view

This task is ex­actly what it sounds like and can be some­what painful for some less tech­ni­cal clients. The point of this ex­er­cise is to es­tab­lish trust and to also let the client know you un­der­stand what is im­por­tant to them.

Re­view your stake­holder in­ter­views and dis­til what is im­por­tant for your client to mea­sure suc­cess. Is it prod­uct sales? Brochure down­loads? Phone calls? Armed with this in­for­ma­tion, you should log into your client’s Google An­a­lyt­ics and re­view their goal track­ing (Ad­min>Goals). Note down which goals re­late to what and, more im­por­tantly, note any miss­ing goals you will need to add. Next ar­range a call or meet­ing with your client (this is im­por­tant – an email won’t do) and run through each goal. Once you’ve es­tab­lished what each goal does and if any need re­plac­ing or amend­ing, sug­gest any new goals you need to add.

For ease you should doc­u­ment what each goal is record­ing (in sim­ple terms) for your client and then record the goals you mean to add on their be­half. It’s at this point I’d rec­om­mend learn­ing how to deal with reg­u­lar ex­pres­sions (RegEx), which will help no end in deal­ing with com­plex goal track­ing; https://

regex101.com/ is an ex­cel­lent de­bug­ging tool once you’re up to speed.

Progress re­view

With your first sprint at an end, you now have three valu­able doc­u­ments ready to present to your client. It’s im­por­tant to get these right, be­cause these doc­u­ments will form the ba­sis of how you plan your next three, six or 12 months. Ide­ally, the whole of the sec­ond sprint will be used to pro­duce your per­for­mance UX strat­egy. Af­ter the work you’ve al­ready put in, the client will un­der­stand the im­por­tance of get­ting this right.

Within your strat­egy doc­u­ment you should record what is im­por­tant to the client in terms of key met­rics. You should then de­tail, month-on­month, how you will work to­wards mea­sur­able progress. Al­ways jus­tify your tac­tics us­ing tech­ni­cal, ex­pe­ri­en­tial or com­mer­cial per­for­mance rea­son­ing. For ex­am­ple, in­stead of say­ing ‘I need to do some card sort­ing to make the nav­i­ga­tion eas­ier to un­der­stand’, try ‘our ex­pe­ri­en­tial user jour­ney re­search showed a dis­con­nect in the la­belling used on the cur­rent nav­i­ga­tion – card sort­ing would al­low us to find a bet­ter so­lu­tion’. Ide­ally you should have a way of show­ing how your work is in­flu­enc­ing the bench­marks you have recorded. I’d rec­om­mend a tool like Power BI or Google’s Data Stu­dio to make an dash­board with all the met­rics up­dat­ing in real time.

How you pro­duce your strat­egy is ul­ti­mately down to you but I would strongly ad­vise a var­ied strat­egy. Cover all three pil­lars when­ever pos­si­ble. Com­mer­cial is where users end up, ex­pe­ri­en­tial is how they get there and tech­ni­cal is what’s stop­ping them on their jour­ney. Too much tech­ni­cal work and you will lose your client’s in­ter­est, too much ex­pe­ri­en­tial work and they might start to ques­tion value and too much com­mer­cial work just be­comes con­ver­sion rate op­ti­mi­sa­tion.

Per­for­mance UX is unique in that you get to be an ad­vo­cate for the user and for your client. You job is to be an old-fash­ioned ‘mid­dle man (or woman)’ and make it as easy as pos­si­ble for both par­ties to get what they want. So get out there and start greas­ing those wheels.

Top Cen­ter Cen­tre set out to cre­ate a place for UX train­ing that is fu­ture ready and rel­e­vant

Above Work­ing quickly and it­er­a­tively is a core part of per­for­mance UX. Books such as Sprint can help you im­prove ef­fi­ciency.

Above Light­house runs in the browser (or in node/com­mand line) and gives an in­sight into any tech­ni­cal per­for­mance is­sues.

Above Hot­jar has a num­ber of tools to help with user be­hav­iour in­sight. The jour­ney record­ings pro­vide a good ba­sis for on­go­ing hy­poth­e­sis test­ing

Newspapers in English

Newspapers from Australia

© PressReader. All rights reserved.