SlideShare une entreprise Scribd logo
1  sur  18
Télécharger pour lire hors ligne
Locastyle standards: creating interfaces in an agile, scalable and responsive way
Italo Oliveira
• Digital Designer
• 12-year-experience on interactive
projects, websites, apps, ecommerce, and more…
• 2 years of Locaweb, as Visual
Design Coordinator

Cargocollective.com.br/italoliveira
José Cipriano
• Musician and marathoner in his free
time
• Major in International Relations and
Marketing
• 12 years trying to find out solutions to
problems of users
• 1 year and a half handling products
interfaces of Locaweb

zecipriano7

jccipriano

jccipriano

jccipriano
About Locaweb
• 15 years
• +1000 employees
• Hosting & Infrastructure
Services leader in Brazil
and Latin America
• +260 K customers
• 25 products (SaaS, PaaS
and IaaS)
+
2
Million

About Locaweb

E-mail
accounts

• 15 years
• +1000 employees
• Hosting & Infrastructure
Services leader in Brazil
and Latin America
• +260 K customers
• 25 products (SaaS, PaaS
and IaaS)

+
450 K
Active
Websites

+
800 K
Domains

+
7,5 K
Cloud
Servers
Locaweb UX Team
• 10 members
• Works directly with Locweb
Product Teams
• Recently started working
with Website and
Customer Support Teams
WE BELIEVE IN LEAN UX
Think
• Create the main
personas
• Identify goals and
problems
• Formulate
hypotheses about
interactions

Do
• Draw, draw, draw
• Invite members of
the Team to draw
• Design
wireframes and/or
prototypes from
the best ideas

Test
• Show them to the
Team and ask
feedback

• Invite real users and
who is near you to test
• Adjust the prototype
and keep iterating
=
DEVELOPING
STANDARDS
WHAT IS OUR PROBLEM?
There is no pattern to our product interactions

•
•
•
•

Difficulty to conduct processes concerning panels implementation
UX Team is not close to Front-end Team
User Tests? NO WAY!
Lack of time to draw and code Panels interfaces
LOCASTYLE BOTTOM LINE
Customer
Workbench

 Recently updated Panel
 Research and Interview
with customers
 Personas created
 Tests performed with
real customers

 Easy customization
 Easy maintenance
 Large number of
elements
 Scalable
BETA PROJECT
• Simple and low impact panel
• Elements created on demand
• Work of co-creation between
some members of the UX
teams and front-end
• Prototyping and test
application with users
• Ready in 2 months
THE EVOLUTION
• Remodeling of Email Marketing
panel (a “core business”
product of the company)
• Crucial for creating standards
to the next panels
• +80% of Locastyle elements
were created during this project
THE EVOLUTION
• Remodeling of Email Marketing
panel (a “core business”
product of the company)
• Crucial for creating standards
to the next panels
• +80% of Locastyle elements
were created during this project
AND FINALLY…
• We released our Library to the
GitHub developers community
…UP TO NOW:
10

40

+1500

Panels

GitHub

Projects
OUR BENEFITS
• Nimble creating of high fidelity
prototypes
• Helped in the design of new
products and the remodeling and
improvement of existing ones
• Today the user test is included on
a daily basis
NOT ALWAYS A BED OF ROSES
• Responsiveness and Library documentation process
were postponed
• Some elements did not fit all cases
• Not all members of the Team were involved
Next steps
•
•
•

•

•

Mobile First
UX Library documentation
Validating individual and
combined elements (mobile
first requirement)
All members of the Team
joined activities of creating
elements
Co-creation workshops with
UX and Front-end Teams
Locastyle standards: creating interfaces in an agile, scalable and responsive way

Contenu connexe

Similaire à Locastyle standards: creating interfaces in an agile, scalable and responsive way

BizTalk360 - About the organization
BizTalk360 - About the organizationBizTalk360 - About the organization
BizTalk360 - About the organizationBizTalk360
 
ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!
ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!
ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!dclsocialmedia
 
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012Patrick McDonnell
 
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012Michael Rembetsy
 
New life inside monolithic application
New life inside monolithic applicationNew life inside monolithic application
New life inside monolithic applicationTaras Matyashovsky
 
Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...
Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...
Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...AgileNZ Conference
 
Lean Startup: Reduce 40% go-to-market time & cost on your next product launch
Lean Startup: Reduce 40% go-to-market time & cost on your next product launchLean Startup: Reduce 40% go-to-market time & cost on your next product launch
Lean Startup: Reduce 40% go-to-market time & cost on your next product launchPeople10 Technosoft Private Limited
 
AD1545 - Extending the XPages Extension Library
AD1545 - Extending the XPages Extension LibraryAD1545 - Extending the XPages Extension Library
AD1545 - Extending the XPages Extension Librarypaidi_ed
 
Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board
Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board
Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board Cloud for Good
 
Wizard - Credential 2013
Wizard - Credential 2013Wizard - Credential 2013
Wizard - Credential 2013Vũ Thịnh
 
LF_APIStrat17_Creating an API Ecosystem that Benefits Producers and Consumers
LF_APIStrat17_Creating an API Ecosystem that Benefits Producers and ConsumersLF_APIStrat17_Creating an API Ecosystem that Benefits Producers and Consumers
LF_APIStrat17_Creating an API Ecosystem that Benefits Producers and ConsumersLF_APIStrat
 
Managing Experimentation in a Continuously Deployed Environment
Managing Experimentation in a Continuously Deployed EnvironmentManaging Experimentation in a Continuously Deployed Environment
Managing Experimentation in a Continuously Deployed EnvironmentC4Media
 
Transitioning to Kanban: From Theory to Practice
Transitioning to Kanban: From Theory to PracticeTransitioning to Kanban: From Theory to Practice
Transitioning to Kanban: From Theory to PracticeTechWell
 
Webinar: 2 Billion Data Points Each Day
Webinar: 2 Billion Data Points Each DayWebinar: 2 Billion Data Points Each Day
Webinar: 2 Billion Data Points Each DayDataStax
 
CrowdFlower Product Webinar - Graphical Editor and Visual Reports
CrowdFlower Product Webinar - Graphical Editor and Visual ReportsCrowdFlower Product Webinar - Graphical Editor and Visual Reports
CrowdFlower Product Webinar - Graphical Editor and Visual ReportsCrowdFlower
 
[Pharma] Bonita Live Tour 2019 - Business Process Automation
[Pharma] Bonita Live Tour 2019 - Business Process Automation[Pharma] Bonita Live Tour 2019 - Business Process Automation
[Pharma] Bonita Live Tour 2019 - Business Process AutomationBonitasoft
 
DevOps maturity models Knowit and DASA
DevOps maturity models Knowit and DASADevOps maturity models Knowit and DASA
DevOps maturity models Knowit and DASAKari Kakkonen
 
StackDive: Yesware
StackDive: YeswareStackDive: Yesware
StackDive: YeswareStackDive
 
Startup Kitchen - Bandung Ventures Night 2011
Startup Kitchen - Bandung Ventures Night 2011Startup Kitchen - Bandung Ventures Night 2011
Startup Kitchen - Bandung Ventures Night 2011Batista Harahap
 

Similaire à Locastyle standards: creating interfaces in an agile, scalable and responsive way (20)

BizTalk360 - About the organization
BizTalk360 - About the organizationBizTalk360 - About the organization
BizTalk360 - About the organization
 
Investor deck
Investor deckInvestor deck
Investor deck
 
ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!
ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!
ASME's Digital Path Initiative: Don't Make a Molehill Out of a Mountain!
 
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
 
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
Continuously Deploying Culture: Scaling Culture at Etsy - Velocity Europe 2012
 
New life inside monolithic application
New life inside monolithic applicationNew life inside monolithic application
New life inside monolithic application
 
Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...
Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...
Making the Invisible Visible: Showing WIP & Flow at Portfolio Level in Waterf...
 
Lean Startup: Reduce 40% go-to-market time & cost on your next product launch
Lean Startup: Reduce 40% go-to-market time & cost on your next product launchLean Startup: Reduce 40% go-to-market time & cost on your next product launch
Lean Startup: Reduce 40% go-to-market time & cost on your next product launch
 
AD1545 - Extending the XPages Extension Library
AD1545 - Extending the XPages Extension LibraryAD1545 - Extending the XPages Extension Library
AD1545 - Extending the XPages Extension Library
 
Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board
Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board
Southeast Dreamin' 2016 Presentation: Nonprofit Starter Pack Advisory Board
 
Wizard - Credential 2013
Wizard - Credential 2013Wizard - Credential 2013
Wizard - Credential 2013
 
LF_APIStrat17_Creating an API Ecosystem that Benefits Producers and Consumers
LF_APIStrat17_Creating an API Ecosystem that Benefits Producers and ConsumersLF_APIStrat17_Creating an API Ecosystem that Benefits Producers and Consumers
LF_APIStrat17_Creating an API Ecosystem that Benefits Producers and Consumers
 
Managing Experimentation in a Continuously Deployed Environment
Managing Experimentation in a Continuously Deployed EnvironmentManaging Experimentation in a Continuously Deployed Environment
Managing Experimentation in a Continuously Deployed Environment
 
Transitioning to Kanban: From Theory to Practice
Transitioning to Kanban: From Theory to PracticeTransitioning to Kanban: From Theory to Practice
Transitioning to Kanban: From Theory to Practice
 
Webinar: 2 Billion Data Points Each Day
Webinar: 2 Billion Data Points Each DayWebinar: 2 Billion Data Points Each Day
Webinar: 2 Billion Data Points Each Day
 
CrowdFlower Product Webinar - Graphical Editor and Visual Reports
CrowdFlower Product Webinar - Graphical Editor and Visual ReportsCrowdFlower Product Webinar - Graphical Editor and Visual Reports
CrowdFlower Product Webinar - Graphical Editor and Visual Reports
 
[Pharma] Bonita Live Tour 2019 - Business Process Automation
[Pharma] Bonita Live Tour 2019 - Business Process Automation[Pharma] Bonita Live Tour 2019 - Business Process Automation
[Pharma] Bonita Live Tour 2019 - Business Process Automation
 
DevOps maturity models Knowit and DASA
DevOps maturity models Knowit and DASADevOps maturity models Knowit and DASA
DevOps maturity models Knowit and DASA
 
StackDive: Yesware
StackDive: YeswareStackDive: Yesware
StackDive: Yesware
 
Startup Kitchen - Bandung Ventures Night 2011
Startup Kitchen - Bandung Ventures Night 2011Startup Kitchen - Bandung Ventures Night 2011
Startup Kitchen - Bandung Ventures Night 2011
 

Dernier

NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopBachir Benyammi
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...Aggregage
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAshyamraj55
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdfPedro Manuel
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfinfogdgmi
 
Bird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemBird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemAsko Soukka
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8DianaGray10
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXTarek Kalaji
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.YounusS2
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaborationbruanjhuli
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintMahmoud Rabie
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Will Schroeder
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1DianaGray10
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-pyJamie (Taka) Wang
 
Designing A Time bound resource download URL
Designing A Time bound resource download URLDesigning A Time bound resource download URL
Designing A Time bound resource download URLRuncy Oommen
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1DianaGray10
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UbiTrack UK
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPathCommunity
 
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsComputer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsSeth Reyes
 

Dernier (20)

NIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 WorkshopNIST Cybersecurity Framework (CSF) 2.0 Workshop
NIST Cybersecurity Framework (CSF) 2.0 Workshop
 
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
The Data Metaverse: Unpacking the Roles, Use Cases, and Tech Trends in Data a...
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdf
 
Bird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystemBird eye's view on Camunda open source ecosystem
Bird eye's view on Camunda open source ecosystem
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBX
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
 
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
 
Designing A Time bound resource download URL
Designing A Time bound resource download URLDesigning A Time bound resource download URL
Designing A Time bound resource download URL
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
 
UiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation DevelopersUiPath Community: AI for UiPath Automation Developers
UiPath Community: AI for UiPath Automation Developers
 
Computer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and HazardsComputer 10: Lesson 10 - Online Crimes and Hazards
Computer 10: Lesson 10 - Online Crimes and Hazards
 

Locastyle standards: creating interfaces in an agile, scalable and responsive way

  • 2. Italo Oliveira • Digital Designer • 12-year-experience on interactive projects, websites, apps, ecommerce, and more… • 2 years of Locaweb, as Visual Design Coordinator Cargocollective.com.br/italoliveira
  • 3. José Cipriano • Musician and marathoner in his free time • Major in International Relations and Marketing • 12 years trying to find out solutions to problems of users • 1 year and a half handling products interfaces of Locaweb zecipriano7 jccipriano jccipriano jccipriano
  • 4. About Locaweb • 15 years • +1000 employees • Hosting & Infrastructure Services leader in Brazil and Latin America • +260 K customers • 25 products (SaaS, PaaS and IaaS)
  • 5. + 2 Million About Locaweb E-mail accounts • 15 years • +1000 employees • Hosting & Infrastructure Services leader in Brazil and Latin America • +260 K customers • 25 products (SaaS, PaaS and IaaS) + 450 K Active Websites + 800 K Domains + 7,5 K Cloud Servers
  • 6. Locaweb UX Team • 10 members • Works directly with Locweb Product Teams • Recently started working with Website and Customer Support Teams
  • 7. WE BELIEVE IN LEAN UX Think • Create the main personas • Identify goals and problems • Formulate hypotheses about interactions Do • Draw, draw, draw • Invite members of the Team to draw • Design wireframes and/or prototypes from the best ideas Test • Show them to the Team and ask feedback • Invite real users and who is near you to test • Adjust the prototype and keep iterating
  • 9. WHAT IS OUR PROBLEM? There is no pattern to our product interactions • • • • Difficulty to conduct processes concerning panels implementation UX Team is not close to Front-end Team User Tests? NO WAY! Lack of time to draw and code Panels interfaces
  • 10. LOCASTYLE BOTTOM LINE Customer Workbench  Recently updated Panel  Research and Interview with customers  Personas created  Tests performed with real customers  Easy customization  Easy maintenance  Large number of elements  Scalable
  • 11. BETA PROJECT • Simple and low impact panel • Elements created on demand • Work of co-creation between some members of the UX teams and front-end • Prototyping and test application with users • Ready in 2 months
  • 12. THE EVOLUTION • Remodeling of Email Marketing panel (a “core business” product of the company) • Crucial for creating standards to the next panels • +80% of Locastyle elements were created during this project
  • 13. THE EVOLUTION • Remodeling of Email Marketing panel (a “core business” product of the company) • Crucial for creating standards to the next panels • +80% of Locastyle elements were created during this project AND FINALLY… • We released our Library to the GitHub developers community
  • 15. OUR BENEFITS • Nimble creating of high fidelity prototypes • Helped in the design of new products and the remodeling and improvement of existing ones • Today the user test is included on a daily basis
  • 16. NOT ALWAYS A BED OF ROSES • Responsiveness and Library documentation process were postponed • Some elements did not fit all cases • Not all members of the Team were involved
  • 17. Next steps • • • • • Mobile First UX Library documentation Validating individual and combined elements (mobile first requirement) All members of the Team joined activities of creating elements Co-creation workshops with UX and Front-end Teams