https://www.scarroll.net/aboutme daily 0.75 2021-07-12 https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625630646528-6QQHEUYKDI5EKCQ6AIHE/1512+%282%29.jpeg About - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://www.scarroll.net/contact-me daily 0.75 2021-07-12 https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1626054962421-68SM0D2WVRDI6NCA08EJ/Final+portfolio+logo.png Contact - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://www.scarroll.net/my-resume daily 0.75 2022-10-30 https://www.scarroll.net/reviews daily 0.75 2021-08-06 https://images.squarespace-cdn.com/content/v1/5ec321c2af33de48734cc929/1607694583486-2PQT0LQ193RL7MCB6DX4/20140228_Trade+151_0046.jpg Reviews https://images.squarespace-cdn.com/content/v1/5ec321c2af33de48734cc929/1607694644871-IC85FNH781UNZSZEGHDR/Aro+Ha_0428.jpg Reviews https://images.squarespace-cdn.com/content/v1/5ec321c2af33de48734cc929/1618497259178-6XJGK9GR6YAVBQL5L519/20140301_Trade-151_012-2.jpg Reviews https://www.scarroll.net/mywork daily 1.0 2023-10-19 https://www.scarroll.net/mywork/star-chef-tbsym monthly 0.5 2021-07-13 https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625688278481-JR9ZM8LOY5PCPUSSLRBG/icons8-team-seDjj4dmC9s-unsplash.jpg My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625688790368-NEMI5A1TX02K9379N2OR/P2+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625689020118-AQ1SU10Z2Q9E5HO8MXVX/P3+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625689068679-OIR2XOP3ZJM1UCY6NHZL/P4+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625698343398-SPTLRX5WWNX8AHPT5QQY/P5+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625698399112-WJID5B5CG06VBGLYB7CP/P5.5+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625697728528-0P2G5A2Z3KD3T5U858Z9/P6+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625698931740-MJQCVB0BKA2NO17GI61G/P7+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625698866420-P0RKSLAGRDHG13OLIVSC/P8+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625698793917-7ADKB836EFDE0QXWIK3U/P9+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625699041383-RZ80JPE5P33LWL76WH8V/P10+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625700022218-GR6M76V47K172L0DL165/P11+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625700061136-F98VTQPQO03SW19CMMR7/P11.5+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625700118410-IDF4QFV4IFICPEYMC6OI/P12+Case+Study.png My work - Star Chef https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625700160132-1W2PV1YVJEQJK5XNHPCG/P13+Case+Study.png My work - Star Chef https://www.scarroll.net/mywork/summer-break-f3bd8 monthly 0.5 2021-07-15 https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625074617013-736AWLTVPFWOLW8WEPB4/Screen+Shot+2021-06-30+at+1.35.50+PM.png My work - Summer Break https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625088565974-2ZAJFCJAB2ESU2N6PSYZ/UX+Design+Process.png My work - Summer Break https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625068287262-L6ILC23BUUSADIJQE31W/Empathize.png My work - Summer Break Context: I’ve been a teacher and a school counselor for more than 20 years. By the fall of 2020, it was clear that the Covid-19 pandemic had dealt a serious blow to the teaching community. My colleagues were in crisis. Their jobs changed overnight. They had to learn new technology while teaching online and in person at the same time amid a real risk of infection. Their work had become an overwhelming burden. Parents openly criticized teachers in Facebook groups and at school board meetings. In the hardest-working year of their lives, teachers were called lazy and selfish and they had never been appreciated less. It was a toxic mixture. In a job that never paid well monetarily, but at least it had been fulfilling. No more. Educators began leaving the profession in record numbers. The ones that remained had to work that much harder. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625064650279-90C6F3JUX06KE4OPHDMT/Screen+Shot+2021-06-30+at+10.45.14+AM.png My work - Summer Break https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625064785751-GJBFXAELYH6D5DZ0P9MH/Define.png My work - Summer Break Methods: Screener survey Secondary research- Quantitative research Competitive research Pre-interview survey User interviews- Qualitative research Affinity mapping Empathy mapping Creating a persona https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625068517565-E1MJW5UXD3SQIGDP4Y41/Screen+Shot+2021-06-30+at+11.42.48+AM.png My work - Summer Break https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625069556588-XXIFECOY6HQE3Q4KRF8U/Screen+Shot+2021-06-30+at+11.43.04+AM.png My work - Summer Break https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625081396155-9983FE3ASV9EMF6UB3EA/Screen+Shot+2021-06-30+at+11.43.20+AM.png My work - Summer Break - Persona Based on the interviews, I created the persona of Elsa the Educator. Throughout the entire design and development process I referred back to her again and again. Process: I took notes during the five user interviews. I transferred each idea onto a color-coded sticky note. I later grouped the notes around central ideas to create my Affinity Map. From there, I rearranged and summarized the main themes into an Empathy Map. With these tools, I was able to distill the salient personality, frustrations and context to create a Persona that would guide the rest of my creative process. Whenever I had a question about a font, a color, a category for the information architecture of the app, I would ask myself... "What does Elsa need?" https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625070032504-F9FH2SNPQYOU4PTQWCA7/Screen+Shot+2021-06-30+at+11.43.36+AM.png My work - Summer Break - Methods: How Might We statements Brainstorming Journey map- not used in this case User stories Information architecture Site map- not used in this case User flows Card sorting- open https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625070343833-3FXNH5EBQ5UJPT0FC6RX/Screen+Shot+2021-06-30+at+11.43.57+AM.png My work - Summer Break - Brainstorming & Sketches I played with ideas for how to DESIGN AN APP that would allow educators to find calm and relaxation at every click. What do teachers love? Recess? No, too noisy. The Faculty Lounge? No, too much complaining, and too much work to do. Where do they relax? At the beach on SUMMER BREAK. I played with colors of water, sky, sand and the shapes of waves. My app would offer a list of research-based suggestions for activities that would make them feel good. Users could find great ideas for how to relax and track their moods. They would be able to log their activities and connect with friends through messages, because research shows how our social networks support us. Right away I starting thinking about how I would categorize each activity- by type of activity? By how it made you feel? By what part of yourself you were caring for? I wasn't sure yet. Sketches focused on Elsa at the beach, relaxing, recharging her batteries after a difficult year. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625071280397-5TDXSOICFE4Q3OL6C7YF/Screen+Shot+2021-06-30+at+11.44.11+AM.png My work - Summer Break - User Flows I began with simple information architecture and basic user flows for three red routes using Miro. I first decided to separate the suggested activities into the four categories of Heart, Mind, Body and Soul because I wanted to keep the number of options down, to not overwhelm the user, and they seemed like a delightful and helpful way to categorize a long list of self-care activities. Later, usability testing showed confusion surrounding the groupings. Card sorting showed the same confusion. It seemed the categories were not as helpful as I thought they would be. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625071358434-N7GONMUA369YXL7KWVXP/Screen+Shot+2021-06-30+at+11.44.53+AM.png My work - Summer Break - Card Sorting I wanted to see how users would categorize the different activity suggestions in the app, so I created an open card sort activity which seven participants completed. I started with a list of about 60 MPV user stories that were my first priority to put into the app, based on what the persona needed most. Because Elsa needed to relax, I didn't want to overwhelm her with choices on the app, so I needed for the list of categories to be simple. I created this similarity matrix on OptimalWorkshop.com. I was hoping to find a consensus among the participants on how to group the activities. The more dark blue there is, the more users thought alike about the categories for information architecture. I found the opposite. Almost none of the participants thought alike. Each created their own groups and their own group names that varied widely. Conclusion: Virtually NO overlap. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625071507364-WHUDOI8T0UD5B3FO2VU1/Screen+Shot+2021-06-30+at+11.45.11+AM.png My work - Summer Break - Methods for Design and Creation UI design principles Heuristic evaluation of competitive apps UI elements and behaviors UI patterns Material & iOS Guidelines Mobile first design Sketching Red Route screens Low-Fidelity Mock-ups Wireframes Wireflows High-Fidelity Prototypes Prototype/Test/Iterate/Repeat https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625071596068-ZBW3JOYKZY6OIC1ZBIBN/Screen+Shot+2021-06-30+at+11.45.28+AM.png My work - Summer Break - Mood Board My first attempt at creating a mood for my app was the left half of this mood board. It showed a wide range of colors, saturated images with joyful, juvenile, energetic hues and photos. With some guidance from my mentor, I was able to see that this was NOT what Elsa needed. Elsa needed to relax. The colors that I first chose were happy and ebullient, but the cooler colors of blue, deep purple and teal, as well as the soft, rounded flowing shapes of the UI on the right side of the mood board set a better stage for an app that would relax Elsa all while keeping enough visual contrast to remain ADA accessible/compliant. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625087789519-PFV3B13TXY30WKEBNLJX/Screen+Shot+2021-06-30+at+5.11.19+PM.png My work - Summer Break - Wireframes At the beginning of my design process I created wireframes using Figma. Process: The wireframes allowed me to see the information architecture more clearly- how each screen interacted with each other as the user flowed through. I was able to see that some of the screens I made had no escape route, so I made sure to put one in, before it would be too costly to do so. I worked from low fidelity mock up sketches, that I tested with five users through Marvel Followed by these wireframes on Figma And on to high fidelity mock-ups that I tested with five users using InVision. After the first round of InVision testing, I created another iteration of my High Fidelity Mock Ups through Figma, that five more users tested. There have been four iterations so far. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625072407286-O888CH3I06GQQEWOI5R3/Screen+Shot+2021-06-30+at+11.45.58+AM.png My work - Summer Break - Evolution of Design At each iteration, the design for Summer Break becomes more refined and more in line with what Elsa needs. The first guerrilla usability tests through Marvel indicated that users were confused by too many options. The quick turn-around allowed for the wireframe to be clearer and a bit simpler. I created red routes with the wireframes and saw that they could be simpler still. So, by the time I made the high fidelity mock-ups, the space was cleaner. It was so clean that users couldn’t find how to log an activity. So, in the latest iteration, because of user needs, I made the “Log an activity” button more obvious and switched up the icons. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625072543687-LF0UT8FS5IP1FTI8GZK9/Screen+Shot+2021-06-30+at+11.46.31+AM.png My work - Summer Break https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1625072629587-Z560CVCOQRHRGIBFAX98/Screen+Shot+2021-06-30+at+11.46.46+AM.png My work - Summer Break - Methods: Guerrilla usability testing- hand sketches and Marvel Usability testing of high-fidelity prototype- InVision Usability testing of iterated hi-fi prototype- Figma Prototype/Test/Iterate/Repeat https://www.scarroll.net/mywork/lurnweb monthly 0.5 2021-07-31 https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627759395723-E2WTA5T5R9HT3DG1D96N/quino-al-9blSF_Ay3MY-unsplash.jpg My work - Lurnweb Lurnweb: UX Research to Redesign an E-Learning Dashboard The Challenge of Good, Old-Fashioned Communication or: “Did you say ‘Black phone’ or ‘Platform’?” https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627760808135-L27P5D5Z10GNIZ6QQDTH/Screen+Shot+2021-07-31+at+3.45.52+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627742392111-QTYQ6I63SJVGC3Y72D0Y/quino-al-8gWEAAXJjtI-unsplash.jpg My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627743357933-2YZWO3B6SLJPZY3B2F5U/Screen+Shot+2021-07-28+at+11.17.19+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627930758178-ODVY32E1405X5RVR35UR/Screen+Shot+2021-08-02+at+2.58.28+PM.png My work - Lurnweb - Since this was our first experience working together as a team, my colleagues and I took some time to get to know each other, and each others’ styles and strengths. Unfortunately, all three of us struggled with how to balance our desire to make the client happy with our contracted commitment limiting us to 40 hours of work. Before even beginning on the meat of the project, we spent at least 10 hours in our first week discussing, consulting with our mentors, writing and re-writing our month-long scope and plan. It was a struggle to find how best to proceed. But, once our plan was established, our roles were clear and we were ready to work on the research and the site. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627746458359-PMPUXR6A6KPXE2X1WKF1/quino-al-4SNUcHPiC8c-unsplash.jpg My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627746837467-AAWVBBMVXUWS8O10JX7K/Screen+Shot+2021-07-29+at+11.58.06+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627746751680-ATPH37C57E4WCD1D5KU2/Screen+Shot+2021-07-29+at+11.52.50+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627747003345-4FYDNU7YH8S99DSNRC1X/Screen+Shot+2021-07-29+at+11.57.27+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627745234377-8PV5XZ608G65CE934Y0K/Screen+Shot+2021-07-31+at+11.22.30+AM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627747338995-OVU0E59BRZN36E3CZMUA/wilhelm-gunkel-x6Y29nMZP-o-unsplash.jpg My work - Lurnweb - “Working with research data is a combination of analysis (breaking larger pieces into smaller ones) and synthesis (combining multiple pieces into something new).” — Steve Portigal, Interviewing Users https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1629213905441-3QA7CCE2CSSV0CX4Z9GJ/Screen+Shot+2021-08-17+at+11.10.59+AM.png My work - Lurnweb My colleagues’ work from wireframes to low-fidelity mock-ups, to high-fidelity prototype. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1629214009312-J6QHV306JN3MO1VMT71C/Screen+Shot+2021-08-17+at+11.13.43+AM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1629230597046-T6MEL9J04SY6UV7X2UCD/Screen+Shot+2021-08-17+at+4.01.44+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627749632893-KFD1S9L8IOQ26ZZ9AD30/Screen+Shot+2021-07-30+at+12.02.32+AM.png My work - Lurnweb - Round 2 of Testing From the information gathered in the competitive usability testing, my colleagues created Low-fidelity wireframes that I tested with five users in guerrilla usability testing. They provided valuable insights about what worked well and less well for users, and helped steer us on a path toward more clarity for future users. (Images used with permission.) https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627749747646-KA84EY143BS7T0YA87KN/Screen+Shot+2021-07-30+at+1.02.30+PM.png My work - Lurnweb - Analysis The results showed a concentration of difficulty around a few tasks, and general confusion about the terms on the site and the information architecture. Users expected to be able to find what they thought of as course-related features under the courses themselves. With this information in hand, I sought to clarify the information architecture in the design with my teammates. https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627750969384-V4KN8AF6FTYWKT2D7SBJ/Screen+Shot+2021-07-30+at+12.06.37+AM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627751188738-84J588PK11J0ELOZM61R/Screen+Shot+2021-07-31+at+1.05.58+PM.png My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1627753031505-44XHQUA1JTRZLS7IY05B/eduardo-sanchez-rSRWst-IGlA-unsplash.jpg My work - Lurnweb https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1629212290576-D75VE9AFZA9MP70HNTHV/quino-al-9blSF_Ay3MY-unsplash.jpg My work - Lurnweb - “We aren’t the experts. The people we are interviewing are the experts. We want to gather their stories and opinions, and to hear what they have to say without influencing them.” — Steve Portigal from Interviewing Users https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/1629211592300-BAPSZM4037848IOHL2KW/victoria-strukovskaya-UkEN39LOTw8-unsplash.jpg My work - Lurnweb https://www.scarroll.net/mywork/code-for-canada monthly 0.5 2023-10-19 https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/d59195e6-4048-42a9-85ef-51dc87a5b731/Screenshot+2023-10-18+at+10.36.37+PM.jpg https://images.squarespace-cdn.com/content/v1/60db3ae16715e805a1727839/878a189c-7909-486b-b84f-5cdf62d3c5ee/Screenshot+2023-10-18+at+10.40.36+PM.jpg