SlideShare a Scribd company logo
1 of 50
How we redesigned payfine.co.za Basheera Khan @bash Mike Lewis @originsa Rian van der Merwe @rianvdm Allan Kent @allankent
 
User research Interaction design Visual design Content strategy The elements of user experience: User research
User-centred design User-centred design (UCD) is a process in which the  needs ,  wants , and  objective s  of the end user of an interface are given extensive attention at each stage of the design process.  This approach produces only the  features  and  solutions   that directly meet the  user’s needs  in a usable manner.
Content Strategy Rian van der Merwe @RianVDM
What happens when  words  and images  are  separated ?
You cannot design without content
Content strategy plans for the creation, delivery, and governance of content. Better content.  Content people care about.  Content that supports your business objectives and meets your users' goals. It's a long-term fix for content problems of all sizes. - Kristina Halvorson (@halvorson)
Some examples of bad content
 
 
 
Some examples of good content
 
 
What is payfine’s content strategy?
They don’t have one
A better way For Payfine
Payfine is a website that lets its customers pay their traffic fines online.   We are a government website, but we don't sound like one.   We realize that people hate paying traffic fines, so they come to our site because they have to, not because they want to.   We talk to our customers in a way that communicates that we understand this.   Our manner is friendly, straightforward, and conversational, and always with the goal of helping our customers get through the process as quickly and easily as possible so that they can get on with their lives. Product Voice Statement
Understanding We all know how much it sucks to pay traffic fines, so we will show our customers that we know what they're going through. Friendly We are always open, casual, and speak in a conversational, everyday language. Helpful We always guide users towards the goal of paying their fines - no distractions along the way Dependable Our products and services are solid, reliable, and secure. Personality traits
We use natural, everyday language to evoke a conversational feel. This means we strive to create the impression we are having a one-on-one conversation with our audience.  In conversational language, we don’t use internal jargon, overly promotional phrases, or tech-speak.  Copy and design decisions should support this method, including sentence casing for headers, use of contractions, and simple, uncluttered language. Method
The content
[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Interaction Design Basheera Khan @bash
Initial wireframes
 
 
 
Round 2 wireframes
 
 
 
 
 
 
 
 
 
 
Visual Design Mike Lewis @originsa
 
 
 
 
 
 
 
 
 
How we redesigned payfine.co.za Basheera Khan @bash Mike Lewis @originsa Rian van der Merwe @rianvdm Allan Kent @allankent

More Related Content

What's hot

BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...
BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...
BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...BAM - Belgian Association of Marketing
 
AW Studios, LLC - Spring 2015 Keynote
AW Studios, LLC - Spring 2015 KeynoteAW Studios, LLC - Spring 2015 Keynote
AW Studios, LLC - Spring 2015 Keynoteawstudiosllc
 
Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet)
Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet) Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet)
Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet) SERVICE DESIGN DAYS
 
User Stories building blocks of products by Wajih Aslam
User Stories building blocks of products by Wajih AslamUser Stories building blocks of products by Wajih Aslam
User Stories building blocks of products by Wajih AslamWajih Aslam
 
Persona or personot
Persona or personot Persona or personot
Persona or personot User Vision
 
The way to have a higher SPV.
The way to have a higher SPV.The way to have a higher SPV.
The way to have a higher SPV.Keith Everett
 
How to avoid 5 common self storage website mistakes
How to avoid 5 common self storage website mistakesHow to avoid 5 common self storage website mistakes
How to avoid 5 common self storage website mistakesSpareFoot
 
Website Planning
Website Planning Website Planning
Website Planning Ajay Sharma
 
e-studio-brochure2015
e-studio-brochure2015e-studio-brochure2015
e-studio-brochure2015George LAZA
 
COMM 100 Chpt 3 Emphasis, Voice, and Style
COMM 100 Chpt 3 Emphasis, Voice, and StyleCOMM 100 Chpt 3 Emphasis, Voice, and Style
COMM 100 Chpt 3 Emphasis, Voice, and StyleCarleighBrady
 
Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...
Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...
Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...Agile ME
 
How to team up with ux to make change happen
How to team up with ux to make change happenHow to team up with ux to make change happen
How to team up with ux to make change happenJoe Ford
 
AI Driven Natural Language Search In E-Commerce Industry
AI Driven Natural Language Search In E-Commerce IndustryAI Driven Natural Language Search In E-Commerce Industry
AI Driven Natural Language Search In E-Commerce IndustryLaxmiMPriya
 
Jacob Higley - Infographic CV
Jacob Higley - Infographic CVJacob Higley - Infographic CV
Jacob Higley - Infographic CVJacob Higley
 

What's hot (20)

CRM 101
CRM 101CRM 101
CRM 101
 
Website Adelaide
Website AdelaideWebsite Adelaide
Website Adelaide
 
SME designs
SME designsSME designs
SME designs
 
Winning Bigger Clients and Projects
Winning Bigger Clients and ProjectsWinning Bigger Clients and Projects
Winning Bigger Clients and Projects
 
BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...
BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...
BAM Congres 2017: Mark Herman - When and how to start an interactive dialogue...
 
AW Studios, LLC - Spring 2015 Keynote
AW Studios, LLC - Spring 2015 KeynoteAW Studios, LLC - Spring 2015 Keynote
AW Studios, LLC - Spring 2015 Keynote
 
Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet)
Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet) Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet)
Service Design Days 2018 - Masterclass Adam Smith and Sam Evans (Rawnet)
 
User Stories building blocks of products by Wajih Aslam
User Stories building blocks of products by Wajih AslamUser Stories building blocks of products by Wajih Aslam
User Stories building blocks of products by Wajih Aslam
 
Persona or personot
Persona or personot Persona or personot
Persona or personot
 
The way to have a higher SPV.
The way to have a higher SPV.The way to have a higher SPV.
The way to have a higher SPV.
 
How to avoid 5 common self storage website mistakes
How to avoid 5 common self storage website mistakesHow to avoid 5 common self storage website mistakes
How to avoid 5 common self storage website mistakes
 
Website Planning
Website Planning Website Planning
Website Planning
 
e-studio-brochure2015
e-studio-brochure2015e-studio-brochure2015
e-studio-brochure2015
 
COMM 100 Chpt 3 Emphasis, Voice, and Style
COMM 100 Chpt 3 Emphasis, Voice, and StyleCOMM 100 Chpt 3 Emphasis, Voice, and Style
COMM 100 Chpt 3 Emphasis, Voice, and Style
 
Evalk deck
Evalk deckEvalk deck
Evalk deck
 
Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...
Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...
Workshop: User Stories: Building Blocks of Products by Mirza Asfaar Baig and ...
 
How to team up with ux to make change happen
How to team up with ux to make change happenHow to team up with ux to make change happen
How to team up with ux to make change happen
 
AI Driven Natural Language Search In E-Commerce Industry
AI Driven Natural Language Search In E-Commerce IndustryAI Driven Natural Language Search In E-Commerce Industry
AI Driven Natural Language Search In E-Commerce Industry
 
Rachit company
Rachit companyRachit company
Rachit company
 
Jacob Higley - Infographic CV
Jacob Higley - Infographic CVJacob Higley - Infographic CV
Jacob Higley - Infographic CV
 

Similar to How we redesigned Payfine.co.za - Tech4Africa

Digital Finance Sitecore Finland: Michael Leander keynote presentation
Digital Finance Sitecore Finland: Michael Leander keynote presentationDigital Finance Sitecore Finland: Michael Leander keynote presentation
Digital Finance Sitecore Finland: Michael Leander keynote presentationMichael Leander
 
On Design and My Work
On Design and My WorkOn Design and My Work
On Design and My WorkBenjamin
 
Digital marketing client proposal2
Digital marketing client proposal2Digital marketing client proposal2
Digital marketing client proposal2Theresa Campbell
 
Meet Magento New York City Open Source Office Presentation
Meet Magento New York City Open Source Office PresentationMeet Magento New York City Open Source Office Presentation
Meet Magento New York City Open Source Office PresentationBrent W Peterson
 
Abc bank presents
Abc bank presentsAbc bank presents
Abc bank presentsDave Garcia
 
Conversion clickz
Conversion clickzConversion clickz
Conversion clickzAnju Yadav
 
Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360
Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360
Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360Aduniverse360
 
The Birth A Of Modern Website - Mixed Digital's Web Re-Design Case Study
The Birth A Of Modern Website - Mixed Digital's Web Re-Design Case StudyThe Birth A Of Modern Website - Mixed Digital's Web Re-Design Case Study
The Birth A Of Modern Website - Mixed Digital's Web Re-Design Case StudyMark F Simmons
 
Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...
Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...
Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...BookNet Canada
 
Drive Prospects Down the Funnel with Chatbots
Drive Prospects Down the Funnel with ChatbotsDrive Prospects Down the Funnel with Chatbots
Drive Prospects Down the Funnel with ChatbotsHanapin Marketing
 
Proofpoint Marketing Digital Client Onboarding Document
Proofpoint Marketing Digital Client Onboarding DocumentProofpoint Marketing Digital Client Onboarding Document
Proofpoint Marketing Digital Client Onboarding DocumentProofpoint Marketing
 
Retainer plan SME
Retainer plan SMERetainer plan SME
Retainer plan SMERepublicGov
 
Web Design and Software Development
Web Design and Software DevelopmentWeb Design and Software Development
Web Design and Software DevelopmentAthena Inc, Goa
 
MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...
MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...
MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...Amazon Web Services
 
فایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتال
فایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتالفایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتال
فایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتالدرمسیر بازاریابی دیجیتال
 
Happy Conversations Make Happy Customers
Happy Conversations Make Happy CustomersHappy Conversations Make Happy Customers
Happy Conversations Make Happy CustomersChris Greenough
 

Similar to How we redesigned Payfine.co.za - Tech4Africa (20)

Digital Finance Sitecore Finland: Michael Leander keynote presentation
Digital Finance Sitecore Finland: Michael Leander keynote presentationDigital Finance Sitecore Finland: Michael Leander keynote presentation
Digital Finance Sitecore Finland: Michael Leander keynote presentation
 
On Design and My Work
On Design and My WorkOn Design and My Work
On Design and My Work
 
Digital marketing client proposal2
Digital marketing client proposal2Digital marketing client proposal2
Digital marketing client proposal2
 
Meet Magento New York City Open Source Office Presentation
Meet Magento New York City Open Source Office PresentationMeet Magento New York City Open Source Office Presentation
Meet Magento New York City Open Source Office Presentation
 
Abc bank presents
Abc bank presentsAbc bank presents
Abc bank presents
 
Conversion clickz
Conversion clickzConversion clickz
Conversion clickz
 
BuchiTech Ltd
BuchiTech LtdBuchiTech Ltd
BuchiTech Ltd
 
Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360
Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360
Digital Marketing Agency & Web Design Company In USA & India | AdUniverse360
 
Ameex Creative Services
Ameex Creative ServicesAmeex Creative Services
Ameex Creative Services
 
The Birth A Of Modern Website - Mixed Digital's Web Re-Design Case Study
The Birth A Of Modern Website - Mixed Digital's Web Re-Design Case StudyThe Birth A Of Modern Website - Mixed Digital's Web Re-Design Case Study
The Birth A Of Modern Website - Mixed Digital's Web Re-Design Case Study
 
Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...
Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...
Transcript: Applying content marketing hacks from Tech to Publishing - Tech F...
 
Drive Prospects Down the Funnel with Chatbots
Drive Prospects Down the Funnel with ChatbotsDrive Prospects Down the Funnel with Chatbots
Drive Prospects Down the Funnel with Chatbots
 
Proofpoint Marketing Digital Client Onboarding Document
Proofpoint Marketing Digital Client Onboarding DocumentProofpoint Marketing Digital Client Onboarding Document
Proofpoint Marketing Digital Client Onboarding Document
 
Biztech Brochure 2014
Biztech Brochure 2014Biztech Brochure 2014
Biztech Brochure 2014
 
Retainer plan SME
Retainer plan SMERetainer plan SME
Retainer plan SME
 
Web Design and Software Development
Web Design and Software DevelopmentWeb Design and Software Development
Web Design and Software Development
 
MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...
MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...
MCL301_Building a Voice-Enabled Customer Service Chatbot Using Amazon Lex and...
 
Ilyan.com services overview
Ilyan.com   services overviewIlyan.com   services overview
Ilyan.com services overview
 
فایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتال
فایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتالفایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتال
فایل ارائه علیرضا بیات در دورهمی شانزدهم در مسیر بازاریابی دیجیتال
 
Happy Conversations Make Happy Customers
Happy Conversations Make Happy CustomersHappy Conversations Make Happy Customers
Happy Conversations Make Happy Customers
 

More from Rian van der Merwe

Surviving the Enterprise Storm - Designing in Complex Organizations
Surviving the Enterprise Storm - Designing in Complex OrganizationsSurviving the Enterprise Storm - Designing in Complex Organizations
Surviving the Enterprise Storm - Designing in Complex OrganizationsRian van der Merwe
 
An introduction to user experience design
An introduction to user experience designAn introduction to user experience design
An introduction to user experience designRian van der Merwe
 
Roadmap to serenity - How to stay sane as a Product Owner
Roadmap to serenity - How to stay sane as a Product OwnerRoadmap to serenity - How to stay sane as a Product Owner
Roadmap to serenity - How to stay sane as a Product OwnerRian van der Merwe
 
Measuring the effectiveness of content strategy
Measuring the effectiveness of content strategyMeasuring the effectiveness of content strategy
Measuring the effectiveness of content strategyRian van der Merwe
 
The highs and horrors of website redesigns
The highs and horrors of website redesignsThe highs and horrors of website redesigns
The highs and horrors of website redesignsRian van der Merwe
 
Combining user insights, analytics and design to drive change and product inn...
Combining user insights, analytics and design to drive change and product inn...Combining user insights, analytics and design to drive change and product inn...
Combining user insights, analytics and design to drive change and product inn...Rian van der Merwe
 

More from Rian van der Merwe (9)

Surviving the Enterprise Storm - Designing in Complex Organizations
Surviving the Enterprise Storm - Designing in Complex OrganizationsSurviving the Enterprise Storm - Designing in Complex Organizations
Surviving the Enterprise Storm - Designing in Complex Organizations
 
Back to deliverables
Back to deliverablesBack to deliverables
Back to deliverables
 
Making a better internet
Making a better internetMaking a better internet
Making a better internet
 
An introduction to user experience design
An introduction to user experience designAn introduction to user experience design
An introduction to user experience design
 
Roadmap to serenity - How to stay sane as a Product Owner
Roadmap to serenity - How to stay sane as a Product OwnerRoadmap to serenity - How to stay sane as a Product Owner
Roadmap to serenity - How to stay sane as a Product Owner
 
Measuring the effectiveness of content strategy
Measuring the effectiveness of content strategyMeasuring the effectiveness of content strategy
Measuring the effectiveness of content strategy
 
The highs and horrors of website redesigns
The highs and horrors of website redesignsThe highs and horrors of website redesigns
The highs and horrors of website redesigns
 
Combining user insights, analytics and design to drive change and product inn...
Combining user insights, analytics and design to drive change and product inn...Combining user insights, analytics and design to drive change and product inn...
Combining user insights, analytics and design to drive change and product inn...
 
The End Of MSRP
The End Of MSRPThe End Of MSRP
The End Of MSRP
 

Recently uploaded

'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,Aginakm1
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证nhjeo1gg
 
306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social MediaD SSS
 
定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一
定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一
定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一Fi ss
 
办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一
办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一
办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一Fi L
 
Design and Managing Service in the field of tourism and hospitality industry
Design and Managing Service in the field of tourism and hospitality industryDesign and Managing Service in the field of tourism and hospitality industry
Design and Managing Service in the field of tourism and hospitality industryrioverosanniejoy
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfShivakumar Viswanathan
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic global solution
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case StudySophia Viganò
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptMaryamAfzal41
 
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造kbdhl05e
 
韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作7tz4rjpd
 
办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一
办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一
办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一F La
 
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degreeyuu sss
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degreeyuu sss
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Rndexperts
 
办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一
办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一
办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一diploma 1
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfneelspinoy
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10uasjlagroup
 

Recently uploaded (20)

'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
'CASE STUDY OF INDIRA PARYAVARAN BHAVAN DELHI ,
 
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
 
306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media306MTAMount UCLA University Bachelor's Diploma in Social Media
306MTAMount UCLA University Bachelor's Diploma in Social Media
 
定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一
定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一
定制(CQU文凭证书)中央昆士兰大学毕业证成绩单原版一比一
 
办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一
办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一
办理学位证加州州立大学洛杉矶分校毕业证成绩单原版一比一
 
Design and Managing Service in the field of tourism and hospitality industry
Design and Managing Service in the field of tourism and hospitality industryDesign and Managing Service in the field of tourism and hospitality industry
Design and Managing Service in the field of tourism and hospitality industry
 
FiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdfFiveHypotheses_UIDMasterclass_18April2024.pdf
FiveHypotheses_UIDMasterclass_18April2024.pdf
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing servicesIconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing services
 
ARt app | UX Case Study
ARt app | UX Case StudyARt app | UX Case Study
ARt app | UX Case Study
 
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis pptcda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
 
西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造西北大学毕业证学位证成绩单-怎么样办伪造
西北大学毕业证学位证成绩单-怎么样办伪造
 
韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作韩国SKKU学位证,成均馆大学毕业证书1:1制作
韩国SKKU学位证,成均馆大学毕业证书1:1制作
 
办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一
办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一
办理(宾州州立毕业证书)美国宾夕法尼亚州立大学毕业证成绩单原版一比一
 
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
 
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
 
Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025Top 10 Modern Web Design Trends for 2025
Top 10 Modern Web Design Trends for 2025
 
办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一
办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一
办理(麻省罗威尔毕业证书)美国麻省大学罗威尔校区毕业证成绩单原版一比一
 
group_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdfgroup_15_empirya_p1projectIndustrial.pdf
group_15_empirya_p1projectIndustrial.pdf
 
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
CREATING A POSITIVE SCHOOL CULTURE CHAPTER 10
 

How we redesigned Payfine.co.za - Tech4Africa

  • 1. How we redesigned payfine.co.za Basheera Khan @bash Mike Lewis @originsa Rian van der Merwe @rianvdm Allan Kent @allankent
  • 2.  
  • 3. User research Interaction design Visual design Content strategy The elements of user experience: User research
  • 4. User-centred design User-centred design (UCD) is a process in which the needs , wants , and objective s of the end user of an interface are given extensive attention at each stage of the design process. This approach produces only the features and solutions that directly meet the user’s needs in a usable manner.
  • 5. Content Strategy Rian van der Merwe @RianVDM
  • 6. What happens when words and images are separated ?
  • 7. You cannot design without content
  • 8. Content strategy plans for the creation, delivery, and governance of content. Better content. Content people care about. Content that supports your business objectives and meets your users' goals. It's a long-term fix for content problems of all sizes. - Kristina Halvorson (@halvorson)
  • 9. Some examples of bad content
  • 10.  
  • 11.  
  • 12.  
  • 13. Some examples of good content
  • 14.  
  • 15.  
  • 16. What is payfine’s content strategy?
  • 18. A better way For Payfine
  • 19. Payfine is a website that lets its customers pay their traffic fines online.  We are a government website, but we don't sound like one.  We realize that people hate paying traffic fines, so they come to our site because they have to, not because they want to.  We talk to our customers in a way that communicates that we understand this.  Our manner is friendly, straightforward, and conversational, and always with the goal of helping our customers get through the process as quickly and easily as possible so that they can get on with their lives. Product Voice Statement
  • 20. Understanding We all know how much it sucks to pay traffic fines, so we will show our customers that we know what they're going through. Friendly We are always open, casual, and speak in a conversational, everyday language. Helpful We always guide users towards the goal of paying their fines - no distractions along the way Dependable Our products and services are solid, reliable, and secure. Personality traits
  • 21. We use natural, everyday language to evoke a conversational feel. This means we strive to create the impression we are having a one-on-one conversation with our audience. In conversational language, we don’t use internal jargon, overly promotional phrases, or tech-speak. Copy and design decisions should support this method, including sentence casing for headers, use of contractions, and simple, uncluttered language. Method
  • 23.
  • 26.  
  • 27.  
  • 28.  
  • 30.  
  • 31.  
  • 32.  
  • 33.  
  • 34.  
  • 35.  
  • 36.  
  • 37.  
  • 38.  
  • 39.  
  • 40. Visual Design Mike Lewis @originsa
  • 41.  
  • 42.  
  • 43.  
  • 44.  
  • 45.  
  • 46.  
  • 47.  
  • 48.  
  • 49.  
  • 50. How we redesigned payfine.co.za Basheera Khan @bash Mike Lewis @originsa Rian van der Merwe @rianvdm Allan Kent @allankent

Editor's Notes

  1. An example of bad content – technical jargon that doesn’t mean much to the user. “Turnkey aggregated standardized branded end-to-end store.”
  2. Another example of bad content – this time closer to home, and how it can make UX very difficult. Why user number? Why the message about your PIN? What does “Reset” do – isit even necessary? Logon should be two words… Log in. “click here” doesn’t look clickable, and it is no longer a standard to link “click here” anyway.
  3. Simple content that matches the design. Focused on what they do, in language the user can understand.
  4. Another site often shown as an example of good content. It’s financial software, but the language is not jargony at all, and explains what they do in simple language from the user’s perspective.
  5. So many things wrong with this… Fake excitement, as if this is one of the best things you can find on the Internet Bad punctuation (Why all the exclamation points? Why hyphens on “ticket number” and “notice number”?) Rhetorical questions (question-talkers!): Already registered? New user? Red text that draws the eye (danger, danger!), but so long that very few visitors will read it Jargon (what’s AARTO, and why would users care?) Logout/login/Log In (innit caps)