SlideShare une entreprise Scribd logo
1  sur  30
Télécharger pour lire hors ligne
ordPress 

UX Workflow
Using WordPress for your UX Toolset
Gloria Antonelli

WordCamp Chicago 2018
Agenda
UX Workflow Overview

WordPress vs. UX Online Tools

For Small Business 

Web Consulting Clients

Freelancers & Small UX Teams

WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
UX Consultant
Research
Strategy
Design
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
WordPress Developer & Trainer/Educator
Workflow
for Project Management,
UX Tools, User Testing &
Document Organization.
Multiple ways of creating websites.

Different tools to make it happen.

WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
User Experience is identifying
a real-world problem and
using design to solve it.
strategy > research > analysis > design > evaluate > repeat
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
invisionapp.com/blog/building-an-enterprise-ux-team/
UX Process
Research & Ideation

Information Architecture

Wireframing

Prototyping

User Testing
theblog.adobe.com/ux-process
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
Start with Discovery
Identify Business Goals & User Needs to
develop a strategy that balances the two.
Competitor Analysis

Audience Analysis

User Scenarios
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
Design Thinking
brainstorm outcomes

declare assumptions > hypothesize

create minimum viable product 

user feedback > learn > repeat
User Centered Problem-Solving
uxknowledgebase.com/sketching
Create UX Artifacts
Understanding the User
Personas • Scenarios • User Flows • User Stories • Journey Maps
Information Architecture
• Card sorting

• White Boarding

• Sticky Notes
The organization of information into an
intuitive structure for task completion.

• Site Maps

• Wireframes

• User Flows
Wireframes
A quick way to sketch out page layout, map out functionality
and catch problems early. Low fidelity with pen & paper.
perzonseo.com
Prototype Landscape
Lucidsoftware on Medium
Let’s add
Prototype Mess
blog.prototypr.io
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
Prototyping Tools
uxtools.co/tools/prototyping
Design Tools
uxtools.co/tools/design
Handoff Tools
uxtools.co/tools/handoff
Design Libraries
https://uxtools.co/tools/design-libraries
Disadvantages
Recurring Cost

Learning Curves

Integrate with other Tools

Build Multiple Viewports

Too many UX Tool Stacks
Static Screens

Basic Functions

Multiple Artboards

Limited Page Interactions

Transition to Code
of using online UX Tools
orkflow
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
No need to learn an external tool.
Native to your workspace and your clients.
Embrace the same language and interface.
Prototypes pushed to devs for production.
User Testing to identify problems.
Set up Dev Environment
local.getflywheel.com/
Flywheel - Thanks for your WordCamp Chicago sponsorship!
Local • XAMPP • MAMP • Vagrant • DesktopServer
Install WordPress

or Multisite
Select a 

Clean Simple Theme
Keep things simple and consistent
remove color - use black, white, gray

Project Management
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
Define, manage, and track the progress of
your projects directly in WordPress.

Todos Plugins
Event Calendars
Sticky Note Plugins
Dashboard Plugins
Custom Post Types
Comments
Avoid the stuff everywhere!
Document Management
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
Categories - Table of contents

Tags - The index

Custom Taxonomies
Content manage all your clients
info, business goals, notes,
ideation, assets and UX artifacts.
Everything in one organized place.
Responsive Prototyping
Drag & Drop Page Builders
Control Page Layout • Reusable Templates,
Rows & Modules • Live Front End Editing •
Multisite Capable • Import/Export
best-3-free-wordpress-page-builder-plugins-compared-2018/
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI
Blocks for Prototyping
UXCamps
chicagocamps.org
UX Camp Fall

Sat, Nov 10, 2018
UX Camp Spring

Sat, May 19, 2018
Prototypes, Process & Play

Thurs & Fri, Aug 9-10, 2018
Thank You!
Gloria Antonelli
gloria@gloriaantonelli.com
WordCamp Chicago 2018
@GloriaAntonelli #WCCHI

Contenu connexe

Similaire à WordPress UX Workflow

Low Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design PlatformsLow Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design PlatformsJohnMcGuigan10
 
Prototyping invision vs axure
Prototyping invision vs axurePrototyping invision vs axure
Prototyping invision vs axureAndrii Rusakov
 
Wireframes and UI-Prototypes
Wireframes and UI-PrototypesWireframes and UI-Prototypes
Wireframes and UI-Prototypestec
 
User Experience for Product Managers
User Experience for Product Managers User Experience for Product Managers
User Experience for Product Managers Michael Ong
 
Tools of destruction - Efrim Bartosik
Tools of destruction  - Efrim BartosikTools of destruction  - Efrim Bartosik
Tools of destruction - Efrim BartosikKuldeep Kulshreshtha
 
Best Web Design Company in Kerala - WIS.pptx
Best Web Design Company in Kerala - WIS.pptxBest Web Design Company in Kerala - WIS.pptx
Best Web Design Company in Kerala - WIS.pptxWeb India Solutions
 
What the UX? – Confessions of a Designer
What the UX? – Confessions of a DesignerWhat the UX? – Confessions of a Designer
What the UX? – Confessions of a DesignerThomas Gläser
 
Citrix Labs Rapid Prototyping Workshop
Citrix Labs Rapid Prototyping WorkshopCitrix Labs Rapid Prototyping Workshop
Citrix Labs Rapid Prototyping WorkshopReuven Cohen
 
Ningjing Sun Resume
Ningjing Sun ResumeNingjing Sun Resume
Ningjing Sun ResumeNingjingSun2
 
Initiating and Sustaining Design Systems for the Enterprise
Initiating and Sustaining Design Systems for the EnterpriseInitiating and Sustaining Design Systems for the Enterprise
Initiating and Sustaining Design Systems for the Enterpriseuxpin
 
Leaping Forward: Finding The Future of Your API Docs
Leaping Forward: Finding The Future of Your API DocsLeaping Forward: Finding The Future of Your API Docs
Leaping Forward: Finding The Future of Your API DocsPronovix
 
IIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the Key
IIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the KeyIIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the Key
IIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the KeyAustraliaChapterIIBA
 
User Experience Bootcamp for Developers
User Experience Bootcamp for DevelopersUser Experience Bootcamp for Developers
User Experience Bootcamp for DevelopersCatherine Robson
 
NUX October 6th 2014 - UX in a traditional enterprise
NUX October 6th 2014 - UX in a traditional enterpriseNUX October 6th 2014 - UX in a traditional enterprise
NUX October 6th 2014 - UX in a traditional enterprisepjhauser
 
Building Cross Platform Mobile Apps
Building Cross Platform Mobile AppsBuilding Cross Platform Mobile Apps
Building Cross Platform Mobile AppsShailendra Chauhan
 
Adopting a Design-First Approach to API Development with SwaggerHub
Adopting a Design-First Approach to API Development with SwaggerHubAdopting a Design-First Approach to API Development with SwaggerHub
Adopting a Design-First Approach to API Development with SwaggerHubSmartBear
 
Non-Developer Options in SharePoint 2013 - Fest Chicago 2014
Non-Developer Options in SharePoint 2013 - Fest Chicago 2014Non-Developer Options in SharePoint 2013 - Fest Chicago 2014
Non-Developer Options in SharePoint 2013 - Fest Chicago 2014Asif Rehmani
 
Orientation pdf_merged.pdf
Orientation pdf_merged.pdfOrientation pdf_merged.pdf
Orientation pdf_merged.pdfDSCIITPatna
 
Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...
Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...
Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...Raghuram Pandurangan
 

Similaire à WordPress UX Workflow (20)

Low Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design PlatformsLow Code Capabilities of Digital Product Design Platforms
Low Code Capabilities of Digital Product Design Platforms
 
AravindaKumarNew
AravindaKumarNewAravindaKumarNew
AravindaKumarNew
 
Prototyping invision vs axure
Prototyping invision vs axurePrototyping invision vs axure
Prototyping invision vs axure
 
Wireframes and UI-Prototypes
Wireframes and UI-PrototypesWireframes and UI-Prototypes
Wireframes and UI-Prototypes
 
User Experience for Product Managers
User Experience for Product Managers User Experience for Product Managers
User Experience for Product Managers
 
Tools of destruction - Efrim Bartosik
Tools of destruction  - Efrim BartosikTools of destruction  - Efrim Bartosik
Tools of destruction - Efrim Bartosik
 
Best Web Design Company in Kerala - WIS.pptx
Best Web Design Company in Kerala - WIS.pptxBest Web Design Company in Kerala - WIS.pptx
Best Web Design Company in Kerala - WIS.pptx
 
What the UX? – Confessions of a Designer
What the UX? – Confessions of a DesignerWhat the UX? – Confessions of a Designer
What the UX? – Confessions of a Designer
 
Citrix Labs Rapid Prototyping Workshop
Citrix Labs Rapid Prototyping WorkshopCitrix Labs Rapid Prototyping Workshop
Citrix Labs Rapid Prototyping Workshop
 
Ningjing Sun Resume
Ningjing Sun ResumeNingjing Sun Resume
Ningjing Sun Resume
 
Initiating and Sustaining Design Systems for the Enterprise
Initiating and Sustaining Design Systems for the EnterpriseInitiating and Sustaining Design Systems for the Enterprise
Initiating and Sustaining Design Systems for the Enterprise
 
Leaping Forward: Finding The Future of Your API Docs
Leaping Forward: Finding The Future of Your API DocsLeaping Forward: Finding The Future of Your API Docs
Leaping Forward: Finding The Future of Your API Docs
 
IIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the Key
IIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the KeyIIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the Key
IIBA® Sydney Unlocking the Power of Low Code No Code: Why BAs Hold the Key
 
User Experience Bootcamp for Developers
User Experience Bootcamp for DevelopersUser Experience Bootcamp for Developers
User Experience Bootcamp for Developers
 
NUX October 6th 2014 - UX in a traditional enterprise
NUX October 6th 2014 - UX in a traditional enterpriseNUX October 6th 2014 - UX in a traditional enterprise
NUX October 6th 2014 - UX in a traditional enterprise
 
Building Cross Platform Mobile Apps
Building Cross Platform Mobile AppsBuilding Cross Platform Mobile Apps
Building Cross Platform Mobile Apps
 
Adopting a Design-First Approach to API Development with SwaggerHub
Adopting a Design-First Approach to API Development with SwaggerHubAdopting a Design-First Approach to API Development with SwaggerHub
Adopting a Design-First Approach to API Development with SwaggerHub
 
Non-Developer Options in SharePoint 2013 - Fest Chicago 2014
Non-Developer Options in SharePoint 2013 - Fest Chicago 2014Non-Developer Options in SharePoint 2013 - Fest Chicago 2014
Non-Developer Options in SharePoint 2013 - Fest Chicago 2014
 
Orientation pdf_merged.pdf
Orientation pdf_merged.pdfOrientation pdf_merged.pdf
Orientation pdf_merged.pdf
 
Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...
Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...
Latest trends in Technical Writing, Authoring on Cloud, Content Delivery for ...
 

Dernier

Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 

Dernier (19)

Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 

WordPress UX Workflow