https://www.caitlin-cagampan.com/projects daily 1.0 2024-04-17 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568088593899-AK7U2TEYRUOSZWM9NO2U/PBE+screenshot.png Projects - Final Screens These are the first 3 steps of the flow with improvements based on usability test findings. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568088862529-202OM7U4JM8LHPH8FI62/PBE+Usability+Test+2.jpg Projects - Usability Testing My first step was to validate the live MVP by conducting in-person, moderated usability tests with people with actual minor vehicle damage. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568088594266-L0I4Q4QFC96KATU7MFQT/PBE-additional-photos.png Projects - Before & After From usability testing, I learned that based on the pattern of the previous screens, users expected to click on the graphic itself to bring up the camera instead of the button. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568088594595-CZD0DWUONAUEJX4N0WV1/PBE-wide-shot.png Projects - Before & After 2 Based on usability testing, I learned that this graphic failed to inform users of which picture to take because of its placement on the vehicle and the orientation of the graphic. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089640264-BWEZMHABM4C2QWFMZN2C/Login+screenshot.png Projects - Final Login Page This is the desktop version of the login page themed to GM’s brand color. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089642660-ULNB4U61PQ5LKR3GPSXK/Workflow+Diagram_clean.jpg Projects - Workflow Diagram I worked closely with the Product Managers to map out how the GM and Mitchell workflows integrated into one flow. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089641420-NI2V2H4IYOZF9TIEX4IC/OEM+wireframe.png Projects - Wireframes I collaborated with a fellow designer to figure out the hub-and-spoke structure of this application process. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089641256-SJ70L4CVDQX9A1JUMZLK/Screen+Shot+2018-09-15+at+6.43.18+PM.png Projects - Visual Scalability I partnered with our UI Developer to make the components themable, thus making this application process easy to scale. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089639502-1AWT65YA6O8V5V0X5CLS/Add+attachment_mobile.png Projects - Mobile Viewport This is an example of how the web app responds to a smaller viewport. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089639790-L6U4E5ME2VYPK1UZNKKS/Add+attachment_desktop.png Projects - Desktop Viewport This is the same screen as the previous image but represented on desktop, in which the application container hits a max width for easy readability. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568090444653-5K51M9C1NFJJ12WB7B36/Magnetic+Screens.png Projects - Final Vision This is how we envisioned all of our products to feel - as one cohesive ecosystem. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568090441988-MAVLM9J5A04K2XYKINAE/Magnetic+Color+Usage.png Projects - Color We wanted to make sure color is used in a thoughtful way, including ensuring the order of data visualization colors isn’t too similar for people with different types of color blindness. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568090442155-6NI08HUETGJ72GP17RQA/Droplists.png Projects - Droplist Component This is an example of a component that grew into necessary variations to fit different use cases. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568090445939-VKKDPPW576XQ0M0OCY83/Photo+Gallery+prototype.png Projects - Photo Gallery Component This is an example of a responsive photo gallery component, in which my team and I thought through the behavior of each sub-component of the gallery. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568090442403-D32RRFOLWSGO3YPE4AMO/Ghost+Button.png Projects - Ghost Button Component This is an example of an added variation of our buttons to have better affordance on darker backgrounds. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568091137908-NXHS4F2V9MMGKMILL9YR/cave+gyromouse+model.jpg Projects - Final Design This is the final proposed solution with improvements based on our usability testing findings. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568091138856-VNGRIAK6S3821CDGBJYD/CAVE+1.png Projects - Usability Testing We conducted in-person, moderated usability tests in order to see how well the current gyromouse functioned. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568091140802-VJ6INBIYDXMI3XRMZOIL/Controller+Competitive+Analysis.png Projects - Competitive Analysis We needed to understand the mechanics of controllers better by doing a competitive analysis of adjacent products. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568091137710-6EA7CJJC7TDP2IJ6WR8D/cave+gyromouse+affinity+diagram.png Projects - Affinity Diagram My team and I organized our usability test observations into an affinity diagram to distill our findings before making design recommendations. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568091138787-H1XEGB8XP2T5P1MYRMYV/CAVE+usability+test+results.png Projects - Usability Findings Here are the common pain points we found based on user types which led to our main design recommendations. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1595227988910-3LY49H359GNS0W1CESRP/StoreV1+-+LG+1232px+no+footer.png Projects The final design, balancing user and business needs https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1589491981919-4EC52RNZO2D80V6KR20G/Artboard+1+gray+bg-100.jpg Projects - Before & after The previous store pages didn’t properly or dynamically represent the uniqueness of each physical location. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1588629393454-8SZC6974VJI1WNXN7W4B/Local+Pages+lo-fis+-+full.png Projects - Lo-fi designs In order to represent all the business requirements, I created many variations of the layout of the page. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1588628943487-KGKN1JG9E8X622CO5Y5U/New+session+-+store+page+open+card+sort.png Projects - Open card sort I conducted a remote, moderated user tests to understand how users plan a successful store visit and to inform the information architecture of the page. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1588629068578-F5AXFD84CVWT1R2RR91L/IMG_0349.JPG Projects - In-store validation testing Our setup when asking store-goers to participate in a usability test. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/35f20938-aba6-4265-acc4-3851f086642a/FR+Launch+Flow+Diagram.png Projects - Make it stand out The fitting room flow for customers was dependent on the operational flow of associates https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1567493786914-UP5S56IDLH1PULN5FU0J/cave+gyromouse+model.jpg Projects https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1567493302803-O1EBCWGBR8N6D5LSCU6T/Magnetic+Screens.png Projects https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1567493636841-BCMJ4LRZER63SWB8S69U/PBE+screenshot.png Projects https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1568089427196-SV9E400UKGG2N64D6HQN/Login+screenshot.png Projects https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1588383839460-JANOKSJA6KH4H7JU6RWV/Banner+web_name+wide.jpg Projects https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1595228400199-YHY3919G97KCKY9Y7TEX/Artboard+1-8.png Projects https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1700534176997-EX676JZK94J7KXI6GKFN/AmazonStyle_FR-Screen_WomensHero_Spring22_051322_1000x1000.jpg Projects https://www.caitlin-cagampan.com/uxtalks daily 0.75 2018-05-31 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1519087889160-CDDKYJBRP3O065HGPA25/Flavors+of+Design+title.png UX Talks https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1519087668448-UFMNAHVNPL8ZQK21CACD/Screen+Shot+2018-02-19+at+4.47.20+PM.png UX Talks https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1519087830462-7AY3S2HKSS05EJ2KDK0R/Screen+Shot+2018-02-19+at+4.49.21+PM.png UX Talks https://www.caitlin-cagampan.com/contact daily 0.75 2018-08-07 https://www.caitlin-cagampan.com/orangejuice daily 0.75 2018-07-31 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1527747922331-2DFCP1PVR4ERQMBCPC2X/OJ+paper+prototype+2.jpg OrangeJuice https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521608513996-ANS5L04FIMK3IAEY4O2R/OrangeJuice+screenshots.jpg OrangeJuice https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1527748072092-YXJH9GRE7MG54QCHW1PI/OJ+paper+prototype1.jpg OrangeJuice https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521008598704-3Y3LLCN4AY4ZLXN12IDK/orangejuice+logo.png OrangeJuice https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1527743930055-SRXOMGWIC04QMUPHRGL9/fullsizeoutput_1c31.jpeg OrangeJuice https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521605412853-6BBQSXNJCNZ15YR87Q93/OrangeJuice+mini+logo.png OrangeJuice https://www.caitlin-cagampan.com/hand-lettering daily 0.75 2018-07-31 https://www.caitlin-cagampan.com/cave daily 0.75 2018-07-31 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1528668907264-ZJTL0X592NG0M7L4XR4W/CAVE+usability+test+results.png CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521933922771-1ELY3DRJJLPTZP87TUDC/cave+gyromouse+model.jpg CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1533079291403-MFWPSAAIV96NUOTMO4WA/CAVE+1.png CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521934500150-422VKVX8OMWAFEWGOV8F/cave+gyromouse+affinity+diagram.png CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1533079366722-8B6TQO321NUT54EWQJVT/CAVE+2.png CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1528668731328-9AMP9WCMRAAXFR9XMART/Controller+Competitive+Analysis.png CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1528669611424-JOHQ6UT2DV6J0PA4NOW6/cave+gyromouse+model.jpg CAVE Gyromouse https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521935018997-3WXCWIVW2QKTNNXF687K/cave+gyromouse+model.jpg CAVE Gyromouse https://www.caitlin-cagampan.com/the-feds daily 0.75 2018-07-31 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1528668079789-VR418PTGSAITZFK9QJK7/The-Feds-Sitemap.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937748737-7GM772TQZ4CUB7V1E4G1/TheFeds_RealHome.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937338653-SNVIK09687UXIV8EIQFK/TheFeds_Persona1.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937338661-0CR7A6Z9Z067CBSGOWSF/TheFeds_Persona2.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937340411-M6ISGE2AP8TH0UWJ7F3V/TheFeds_Persona3.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937340457-CXKOPDEMF268Y1JVTLXC/TheFeds_Persona4.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1529996834637-4DDTZDEFIJQ6GGASKFG6/Lofi+wireframes_homepage.png The Feds Website Lo-fidelity homepage https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937554860-OEZ9PIYDZUKAZG7RUMZF/TheFeds_AxureHome.png The Feds Website Mid-fidelity homepage https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521935238810-DW5H2UVLP0UOA47HFA7H/TheFeds+logo.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1528666477859-X93CCDESV5D53L2WIPRL/The+Feds+Visual+Elements.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937777200-B5KJV80O8YFVWKYOKT45/TheFeds_RealBio.png The Feds Website https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1529996879436-TCKB2G0BQFN2N0QSWFM6/Lofi+wireframes_bandbio.png The Feds Website Lo-fidelity band member biography https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521937580919-3QQW9R9BGP0AG2KYW4FG/TheFeds_AxureBio.png The Feds Website Mid-fidelity band biography https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521935712972-D6OARGSVUNKL1A98LMVT/TheFeds+logo.png The Feds Website https://www.caitlin-cagampan.com/cpr-aid daily 0.75 2018-07-31 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521932149780-P21OGMB1F571BARDI4GW/cpr+aid+screen1.jpg CPR Aid - Default Screen The default screen preps you for the first step of CPR, the pump. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521931931500-X1M41IDR2L4OZPIEQURI/cpr+aid+screen2.jpg CPR Aid - Step 1: Pump By detecting your motion, this screen aids in the pump phase, in which the rate changes color based on accuracy of speed, and the counter increases for each pump https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521931930953-DH5F23U193WYFYSHLSDZ/cpr+aid+screen+3.jpg CPR Aid - Step 2: Blow This screen aids in the blow phase, in which it displays how many breaths were given and how long each breath was. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521931931072-LWGLHO9VJ4F8QAEFPCIN/cpr+aid+screen+4.jpeg CPR Aid - Instructional Screen This feature gave step-by-step instructions on how to properly administer CPR. https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521930774438-7QVT8K2F8JSAEGEPTHYG/cpr+aid+logo.png CPR Aid https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1521933328307-B04GMQGK9ONZC10NJXAE/cpr+aid+logo.png CPR Aid https://www.caitlin-cagampan.com/disney daily 0.75 2018-08-23 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1531334901452-Z4KRME5W88EP9T1P3KO9/Disney+Photo.jpg Welcome, Walt Disney Company https://www.caitlin-cagampan.com/google-vd daily 0.75 2018-07-19 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1532025553993-F33FWKW757FDBKOPRMMX/portrait_graybg.png Hi, Google! https://www.caitlin-cagampan.com/google-ixd daily 0.75 2018-08-23 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1532025553993-F33FWKW757FDBKOPRMMX/portrait_graybg.png Hi, Google! https://www.caitlin-cagampan.com/expedia daily 0.75 2018-08-09 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1533775200351-0CYU5Q88C20UCDMSLD87/LRG_DSC01710.jpg Hi, Expedia! https://www.caitlin-cagampan.com/uber daily 0.75 2018-09-07 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1536283430005-J0L3AC6DOFNJNOLU9X3P/portrait_graybg.png Welcome, Uber! https://www.caitlin-cagampan.com/zillow-search daily 0.75 2018-08-16 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1532025553993-F33FWKW757FDBKOPRMMX/portrait_graybg.png Hi, Zillow! https://www.caitlin-cagampan.com/pitchbook daily 0.75 2018-08-21 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1532025553993-F33FWKW757FDBKOPRMMX/portrait_graybg.png Hi, PitchBook! https://www.caitlin-cagampan.com/nintendo daily 0.75 2018-08-25 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1534375024551-WPM4TCM8PZS0VTPLXN0K/IMG_6958.jpg Hi, Nintendo! https://www.caitlin-cagampan.com/projects-1 daily 0.75 2019-08-29 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566691136675-U7X1TS46PX10AU8MI208/PBE+screenshot+withlock.png Projects - New Layout https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566689997691-55T499803HFVOF7PUDG2/mitchell-logo-withlock.png Projects - New Layout https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566690709188-LE3QQS9KZKD18L61VOOF/Login+screenshot+with+lock-01.png Projects - New Layout https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566691196024-KUZJJI784DY9ZV0BBUX6/cave+gyromouse+model.jpg Projects - New Layout https://www.caitlin-cagampan.com/about daily 0.75 2020-05-02 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1588379373813-2VAQB06R4T1M3DS3YDAB/Portfolio+pic+teal+simple.jpg My Story https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1588382531735-JO46WV1254YPKYH0QD5G/Banner+web_blank.jpg My Story https://www.caitlin-cagampan.com/projects-improved daily 0.75 2019-09-02 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566691196024-KUZJJI784DY9ZV0BBUX6/cave+gyromouse+model.jpg Caitlin Cagampan https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566691136675-U7X1TS46PX10AU8MI208/PBE+screenshot+withlock.png Caitlin Cagampan https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1566689997691-55T499803HFVOF7PUDG2/mitchell-logo-withlock.png Caitlin Cagampan https://www.caitlin-cagampan.com/gamified-news-app-old daily 0.75 2019-09-03 https://images.squarespace-cdn.com/content/v1/5a2e4a346f4ca325a623360b/1567466981782-NL6OED31KY6IVIJYK36E/Haiku+-+pitch+mockups.png Gamified News App old