Slide 1

Slide 1 text

CONFIDENTIAL & PROPRIETARY 2018 1

Slide 2

Slide 2 text

CONFIDENTIAL & PROPRIETARY 2018 2

Slide 3

Slide 3 text

CONFIDENTIAL & PROPRIETARY 2018 3

Slide 4

Slide 4 text

CONFIDENTIAL & PROPRIETARY 2018 4 Ulta Beauty Day of Code Company Overview

Slide 5

Slide 5 text

CONFIDENTIAL & PROPRIETARY 2018 5 Differentiated Offering 1,074 convenient locations in 48 states, 90% off-mall More than 35,000 Employees 20,000+ SKUs, 500+ brands: All Things Beauty. All In One Place. Full service salon with hair, skin, brow and makeup services TM Locations Products Services

Slide 6

Slide 6 text

CONFIDENTIAL & PROPRIETARY 2018 6 Loyalty Program Is One Of Our Most Valuable Assets DRIVERS OF ACCELERATED GROWTH RATE 27.8M active members as of February 2018 Strong member retention Enhanced brand partner engagement Increasing focus on targeted CRM campaigns Rolled out credit card program to gain greater share of beauty wallet Launched Diamond tier for guests who spend more than $1,200/year Increasing personalization of offers and content

Slide 7

Slide 7 text

CONFIDENTIAL & PROPRIETARY 2018 7 $0 $100 $200 $300 $400 $500 $600 2013 2014 2015 2016 2017 E-COMMERCE SALES ($ MILLIONS) Top line growth of 65% in 2017, ~10% of total sales E-commerce sales are largely incremental Guest behavior focused on trial and discovery Enhancing omni-channel capabilities and expanding assortment with online only brands Improvement in fulfillment capabilities, targeting 95% of orders delivered in 3 days by 2018 $96 $150 $221 $345 $569 Driving Rapid E-Commerce Growth

Slide 8

Slide 8 text

CONFIDENTIAL & PROPRIETARY 2018 8 Ulta Beauty Day of Code User Experience

Slide 9

Slide 9 text

CONFIDENTIAL & PROPRIETARY 2018 9 USER EXPERIENCE DESIGN KNOW HER & CREATE FOR HER • User Experience (UX) is the experience that a guest (user) has while interacting with our product (digital, physical, or service). • UX Design is the process by which we determine what that experience will be: knowing our guests’ needs, knowing the business’s goals, and creating the experience that marries the two. OUR GOAL • Understand our guests’ and business’s needs to create useful, usable, delightful, and engaging interactions that will increase guest loyalty to Ulta Beauty. Jenny Urban Sasha Smith Sr. Digital Experience Manager User Experience Associate EXPERTISE • eCommerce • User Experience (UX) • UX Process & Strategy • Mobile EXPERTISE • Beauty SME • Customer Ratings & Reviews • User Experience • Content

Slide 10

Slide 10 text

CONFIDENTIAL & PROPRIETARY 2018 PROCESS | UX 10 RESEARCH • Journey Mapping • Stakeholder Interviews • Customer Interviews • Customer Survey • Competitive Analysis • Heuristic Analysis • Metrics Review • Heat Map Reviews • Session Cam Reviews • External Research Review • A/B Testing • Analytics Review • Card Sorting • Tree Testing Discover & Define

Slide 11

Slide 11 text

CONFIDENTIAL & PROPRIETARY 2018 PROCESS | UX 11 wires/comps prototype internal input user testing RESEARCH • Journey Mapping • Stakeholder Interviews • Customer Interviews • Customer Survey • Competitive Analysis • Heuristic Analysis • Metrics Review • Heat Map Reviews • Session Cam Reviews • External Research Review • A/B Testing • Analytics Review • Card Sorting • Tree Testing TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Review CREATE • Use Case & Scenario Creation • User Flow • Sketching • Wireframe Creation • Prototype Creation RESEARCH • User Testing • Identify A/B Testing Opportunities Concept & Design Discover & Define

Slide 12

Slide 12 text

CONFIDENTIAL & PROPRIETARY 2018 PROCESS | UX 12 wires/comps prototype internal input user testing RESEARCH • Journey Mapping • Stakeholder Interviews • Customer Interviews • Customer Survey • Competitive Analysis • Heuristic Analysis • Metrics Review • Heat Map Reviews • Session Cam Reviews • External Research Review • A/B Testing • Analytics Review • Card Sorting • Tree Testing TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Review CREATE • Use Case & Scenario Creation • User Flow • Sketching • Wireframe Creation • Prototype Creation RESEARCH • User Testing • Identify A/B Testing Opportunities TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Reviews CREATE • Flow Maps • Wireframe Spec • Copy w/ Copywriter Concept & Design Discover & Define Document

Slide 13

Slide 13 text

CONFIDENTIAL & PROPRIETARY 2018 PROCESS | UX 13 wires/comps prototype internal input user testing Develop & QA RESEARCH • Journey Mapping • Stakeholder Interviews • Customer Interviews • Customer Survey • Competitive Analysis • Heuristic Analysis • Metrics Review • Heat Map Reviews • Session Cam Reviews • External Research Review • A/B Testing • Analytics Review • Card Sorting • Tree Testing TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Review CREATE • Use Case & Scenario Creation • User Flow • Sketching • Wireframe Creation • Prototype Creation RESEARCH • User Testing • Identify A/B Testing Opportunities TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Reviews CREATE • Flow Maps • Wireframe Spec • Copy w/ Copywriter TEAM COLLABORATION • Review in Progress Dev • Work through Needed Changes CREATE • Update Wires and Design as Needed VERIFY • UAT Testing & Reporting Concept & Design Discover & Define Document Implement

Slide 14

Slide 14 text

CONFIDENTIAL & PROPRIETARY 2018 PROCESS | UX 14 Launch Learn wires/comps prototype internal input user testing Develop & QA RESEARCH • Journey Mapping • Stakeholder Interviews • Customer Interviews • Customer Survey • Competitive Analysis • Heuristic Analysis • Metrics Review • Heat Map Reviews • Session Cam Reviews • External Research Review • A/B Testing • Analytics Review • Card Sorting • Tree Testing TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Review CREATE • Use Case & Scenario Creation • User Flow • Sketching • Wireframe Creation • Prototype Creation RESEARCH • User Testing • Identify A/B Testing Opportunities TEAM COLLABORATION • Brainstorm Sessions • Cross Team Working Sessions • Design Reviews CREATE • Flow Maps • Wireframe Spec • Copy w/ Copywriter TEAM COLLABORATION • Review in Progress Dev • Work through Needed Changes CREATE • Update Wires and Design as Needed VERIFY • UAT Testing & Reporting RESEARCH • Analytics Review • A/B Testing • Benchmarking • Usability Testing Concept & Design Discover & Define Document Implement Live

Slide 15

Slide 15 text

CONFIDENTIAL & PROPRIETARY 2018 15 PROCESS | UX Launch Learn wires/comps prototype internal input user testing Develop & QA Concept & Design Discover & Define Document Implement Live

Slide 16

Slide 16 text

CONFIDENTIAL & PROPRIETARY 2018 UNDERSTANDING BEST PRACTICES 16

Slide 17

Slide 17 text

CONFIDENTIAL & PROPRIETARY 2018 UNDERSTANDING BEST PRACTICES 17

Slide 18

Slide 18 text

CONFIDENTIAL & PROPRIETARY 2018 UNDERSTANDING BEST PRACTICES 18

Slide 19

Slide 19 text

CONFIDENTIAL & PROPRIETARY 2018 UNDERSTAND OUR GUEST 19 She transcends age, income, and other demographics - it’s all about attitude. She’s the woman who gets “BEAUTY BUTTERFLIES” as she shops for and experiments with beauty for FUN, EXCITEMENT, AND ESCAPE. Her world… She takes PRIDE in her SAVVY MIX of high and low She enjoys beauty and believes it is a PLEASURE, not a chore She is interested and is OPEN to ideas and TRENDS She looks at beauty rules with HER OWN filter

Slide 20

Slide 20 text

CONFIDENTIAL & PROPRIETARY 2018 20 Try On vs. Real Life Competitive Landscape DISCOVER & DEFINE | Competitive Analysis

Slide 21

Slide 21 text

CONFIDENTIAL & PROPRIETARY 2018 CONCEPT & DESIGN 21

Slide 22

Slide 22 text

CONFIDENTIAL & PROPRIETARY 2018 CONCEPT & DESIGN |Paper Sketching & Prototyping 22

Slide 23

Slide 23 text

CONFIDENTIAL & PROPRIETARY 2018 CONCEPT & DESIGN | User Testing 23

Slide 24

Slide 24 text

CONFIDENTIAL & PROPRIETARY 2018 CONCEPT & DESIGN | User Testing 24

Slide 25

Slide 25 text

CONFIDENTIAL & PROPRIETARY 2018 DOCUMENT | Wireframes & Creative Comps 25

Slide 26

Slide 26 text

CONFIDENTIAL & PROPRIETARY 2018 IMPLEMENT | Test During Implementation & Make Updates 26

Slide 27

Slide 27 text

CONFIDENTIAL & PROPRIETARY 2018 IMPLEMENT | Test During Implementation & Make Updates 27

Slide 28

Slide 28 text

CONFIDENTIAL & PROPRIETARY 2018 LIVE WE USE IT • Review the analytics • Gather feedback from guests and Ulta Beauty employees • A/B test • Identify areas of opportunity • Determine how the feature/experience should evolve WHO WANTS TO TRY?! 28 Launch Learn

Slide 29

Slide 29 text

29 ULTA BEAUTY DAY OF CODE Designing for Mobile Apps (Demo)

Slide 30

Slide 30 text

30 ULTA BEAUTY DAY OF CODE Welcome to Xcode (Demo)

Slide 31

Slide 31 text

31 ULTA BEAUTY DAY OF CODE Web Services & Data Models

Slide 32

Slide 32 text

32 APP DATA • Hard-coded data o Requires developer intervention o Violates separation of concerns o Encourages bad design o No way to update nameLabel.text = “Joe Rago” titleLabel.text = “Director, Digital Innovation” descriptionLabel.text = “Something about a comma…”

Slide 33

Slide 33 text

33 APP DATA • Structured Data o Standardized o Easy to change o No code modifications o Encourages good design • JSON o Key-Value structure o Value types: • string • integer • number • boolean • null o Object: { } o Array: [ ]

Slide 34

Slide 34 text

34 JSON { "name":"Joe Rago", "title":"Director, Digital Innovation", "shortDescription":"Lifelong Chicago resident who lives with his family in the West suburbs, enjoys playing/coaching sports, and listening out for the for the next big song. Huge fan of the oxford comma.", "twitter":"@joerago", "imageURL":"profiles_jrago", "favorite":"Apple Music" } nameLabel.text = data.name titleLabel.text = data.title descriptionLabel.text = data.shortDescription

Slide 35

Slide 35 text

35 JSON { "profiles": [ { "name": "Joe Rago” … }, { “name”: ”Jeff Hamm” … }, { “name”: ”Jenny Urban” … } ] }

Slide 36

Slide 36 text

36 JSON { “name”: ”Joe Rago”, “sessions”: 2, ”hungry”: true, “favoriteThings”: [ “commas”, “question marks”, “exclamation points” ], coworker: { name: “Nicholas Eby”, title: “Lead Developer, Digital Innovation” } }

Slide 37

Slide 37 text

37 WEB SERVICES • Still no way to update • Web Services: JSON contract o Data is hosted outside app o Can change without app update • Data no longer controlled by you o Missing keys, null values o Changes in contract • Version your APIs • Offline app o Caching o Databases

Slide 38

Slide 38 text

‹#› PANEL DISCUSSION

Slide 39

Slide 39 text

39 ULTA BEAUTY DAY OF CODE Quality Assurance

Slide 40

Slide 40 text

40 • Quality Assurance: o A process to ensure quality meets business requirements • Quality Assurance Analyst o In Short, a tester or problem solver o Document- Everything that’s found • Types of Testing o Many – System integration, comparison testing, Functional testing, Happy path Testing, Load testing, Automation testing WHAT IS QA? WHO IS QA ANALYST?

Slide 41

Slide 41 text

41

Slide 42

Slide 42 text

42 • Why Dev can’t test their own code? o UNIT TEST !! o “Parental feelings” o Oversite the flows o Less experience with common bugs (/previous bugs) o Bandwidth ULTIMATE QUESTION!

Slide 43

Slide 43 text

43 HIGH LEVEL FLOW Requirements Design Build Testing Release Maintenance Req. Review Test Plan Test Cases Test Execution Test Reporting Environment Set-up Bug/defect/issue PROD Support

Slide 44

Slide 44 text

44 • Famous Tools o JIRA o Application Lifecycle management (ALM) o Visual Studio Team Services (VSTS) Automation – Cucumber, Visual Studio- CodedUI, SOAPUI TOOLS

Slide 45

Slide 45 text

45 • ECC application o Requirement 1: Homework page Test Cases (scenarios): 1) Click on Homework - normal flow 2) Click on Homework exit app and comeback 3) Click on Homework kill the app and comeback 4) Add an item to display – Click on the Homework EXAMPLE

Slide 46

Slide 46 text

46 ULTA BEAUTY DAY OF CODE Code Debugging

Slide 47

Slide 47 text

47 OVERVIEW SUBHEAD SUBHEAD • What is debugging? • Approaches and techniques • Tools available • Example of debugging code • Key Takeaways Debugging Overview

Slide 48

Slide 48 text

48 WHAT IS DEBUGGING? SUBHEAD SUBHEAD • Debugging is a process of solving a problem in an app • Much of your time developing will involve debugging! • Origin of the term o Admiral Grace Hopper o working on a Mark II Computer at Harvard University in 1947, her associates discovered a moth that was stuck in a relay • Some Types of Bugs o Compile time errors (syntax errors) o Run time errors (crashes) o Logic errors (functional errors) What is debugging?

Slide 49

Slide 49 text

49 APPROACHES & TECHNIQUES SUBHEAD SUBHEAD • Obtain steps to repeat the issue • Define and isolate the issue (by action, environment, build, device, etc.) • Try to have a working version to test against and change one variable at a time • Complex bugs don’t always require lots of code to fix • Use any tools to help you understand what is happening Approaches & techniques

Slide 50

Slide 50 text

50 TOOLS SUBHEAD SUBHEAD • Xcode debugger – catches compiler errors / runtime exceptions • Xcode view debugger – look at view layers • Xcode console – can view logs • Xcode breakpoints – walk thru code step by step • Xcode debug navigator and instruments – profile performance • Charles Proxy – view network traffic • Unit tests, code reviews and beta testing help prevent bugs Tools available

Slide 51

Slide 51 text

51 EXAMPLE OF DEBUGGING CODE SUBHEAD • Runtime bug Example of debugging code

Slide 52

Slide 52 text

52 KEY TAKEAWAYS SUBHEAD Takeaways • Debugging is a process of solving a problem in an app • Debugging includes identifying a problem, isolating the source and then fixing it • Debugging can be made easier and can be prevented by using tools and employing strategies such as unit testing, code reviews and beta testing

Slide 53

Slide 53 text

53 ULTA BEAUTY DAY OF CODE Releasing an App (Demo)

Slide 54

Slide 54 text

‹#› THANK YOU, STUDENTS!