https://www.gloriakoh.com/work-v1 daily 0.75 2024-07-26 https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508197341218-O2EI6N47WTF2QDS5G32H/poster+design+cover+jpg.jpg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619562749273-XMY58YH2YON9DKOSLU34/EcoC-Still-6.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619722790560-EKHP22EMGA9L8VJN8ZTH/S4E-Color_Banner.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625768015203-M057RYEJ2ZAJ2RMO4L5Z/SIO-TouchMockup-1.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629217109678-YMLGXW2M95BYL7CG7V56/reopening+%2853+of+78%29.jpg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629234451578-JMP3ZQ1U9VZWHPIBHRME/S4E-UI-Header-2.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629236027608-6OL3NXIBBR2H0J65VE4P/BioD-Header-2.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629228334582-E1XGNFPKDSR29A1WFDM8/TTI-Print_All.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1662146452570-TWJ8SKXVOMB9E1VH5IRN/IDEOU_960x540.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1705604682154-B6EV5FZQPCT2D3KS9RXA/GTB_Tee_v1.JPG Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1510901613690-CLF0O4WDNJMP21H3VF9G/image-asset.jpeg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508195820188-JHOHUGQNB5ZRAQ34TTNZ/image-asset.jpeg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1513474216084-Y4794WIU06PM1I7DLJOD/antigone+redo+jpg.jpg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508195728618-RUD3SU3DL1EC5TN0DIL8/giraffage%2Boctober%2Brun%2Bjpg.jpg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508195785323-ETMGYYTDFTQKWEBPBG33/mitski%2Bfall%2Bjpg.jpg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619476881967-E9S6DJ2CS87WRYL2A15T/image-asset.jpeg Work Illustration by Keith Rankin https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629234382493-SR7PSX6GLULD5BXCR4P0/S4E-UI-Header-2.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693607167-QVY139ORLD05HU122PE0/S4E-UIArtboard+1.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693618918-3Y2MFK6G6Y5FI1AULLMA/S4E-UIArtboard+2.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693613909-JWCEVANYH4P49REPYT2X/S4E-UIArtboard+3.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693615845-9NP9OBVYBFDHDY0XQQ0L/S4E-UIArtboard+4.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693617797-F74EYEUW6HYLT53C2YS8/S4E-UIArtboard+5.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693619157-MKGJ41ZR976ETIN4MF28/S4E-UIArtboard+6.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693620804-YR6I6BVJ65FELGHENWUT/S4E-UIArtboard+7.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693621801-YWP334NZ0MSY6US18DL6/S4E-UIArtboard+8.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693624156-7IHEB2C7NLUA8PB6XDDD/S4E-UIArtboard+11.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602693623713-E13ID7D7ENI6GFV9V3F8/S4E-UIArtboard+12.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619739933120-R44F124PJA74T9MT40GE/S4E-OldMockups.png Work Baby’s first UI https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619711824216-RBH5MHPG9CJ3TRGLP4UM/UIGuide-Scans.png Work Here, I struggled to calculate how many pixels made up a 1.5 inch button, on three different screen sizes. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602792806936-TJIZH21TJE60CR6I2OHT/S4E-Moodboard.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629250669175-0IFF6T33NE6KV8RHZCP3/Screen+Shot+2020-06-11+at+1.38.56+PM.png Work - Make it stand out Rendering courtesy of Design and Production Director, John https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627852734592-AH4HE3N76XLAVDNDOBAT/reopening+%2856+of+78%29.jpg Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619640890485-OL20DM43B22BWCIEVQQR/S4E-StyleGuide.png Work The first iteration of Solve for Earth’s style guide https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629261910981-C3J0QBDPHQZ1EY1ULZLF/S4E-PrintColorPalette.png Work - Make it stand out Print color palette with PMS and CMYK values https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629261943695-NORC68O0600FLJV63QAY/S4E-ColorPalette-UIGuide.png Work - Make it stand out Digital color palette featured in the Solve for Earth UI Design Guidelines https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602821532603-2D8CWKIIFYVLCV1XHIV4/S4E-ColorPalette-Old.png Work The first UI color palette https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1602862397897-PGG7R22FZGNHN1J8JRW0/S4E-OldMockups.png Work My early mockups of Solve for Earth exhibits https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629255168567-O7ZKYBPCJZ9MLQPQAL0P/S4E-ColorPalette-New.png Work The UI color palette, new and improved https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619561847459-K6A5UEHR975AKV7S79B9/S4E-NewMockups.png Work Mockups updated with upgraded colors https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629239259006-RRNQQ54GCJWKVN6REPU0/EcoC-LandingPage.png Work - Make it stand out The landing page, as of August 2021 https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549624993-JYCDW6K08SHWBBLE77G7/EcoC-Still-1.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549631240-BSA5KLVVKYZB2FGEGJ3J/EcoC-Still-2.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549633852-7AXZIN7CXFPEBXF3YU40/EcoC-Still-3.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549638434-LBGEJ8C5502GEJ7HM1WI/EcoC-Still-4.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549646047-UZEF3MVB6QTZWYQC1Y4M/EcoC-Still-5.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549648963-I35IBABG195B7VF4H3GO/EcoC-Still-6.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549650876-G9XZEJNDYOYQFUA9E0HH/EcoC-Still-7.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549657140-QQ5OCO9TE3JVCS6PZN5X/EcoC-Still-8.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549662081-G0JHW5F022C8S6RFUHR3/EcoC-Still-10.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549663061-CCXVDS9TPKCCNGU8DBNS/EcoC-Still-11.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549672627-CHWDGQC1YEJO0S55VIQ6/EcoC-Still-12.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619549670684-MU2RQEQGCGDW7ZQDATV8/EcoC-Still-13.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1619654265898-GJD0JHONKIV8NIE9CCM6/EcoC-StoryboardScans.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629310157901-VKCCSTR15GN710ASCWNC/BioD-Header-2.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629309127014-CY0T2D4L3Z3D1SM5YWHP/BioD-UI-1.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629309109985-NN9M31EIJ93NPIHYLOM2/BioD-UI-2.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687949759-6YRQZU1SJIN337TGCXO8/fish-final.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687950438-1W6S0ZXUPE9CS6H8HJ7B/lock.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687951065-8GW9HY1LCM3XMEW5B56U/med.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687950207-4XL6NT6CNZ9JDXN2GV36/job.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687951237-US5SQC58ZCAA8PVSSYRN/O2.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687953187-D66E7L8VNSR6LU1LOXU4/smile-final.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687943614-OSMKE4IRRW9LJCSJLUDC/bulb.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687946028-5VKWCW1C12TWUTTICADI/cooling.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687953278-0YJZFZTP6FHSGNX6CQCF/sushi.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687947839-FRSOZI83NZ9PO1REMZOW/eating.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687952172-6IMYTAAX43WOTRGHUP23/shirt.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625686390430-IL7X0Z72N3GXQFV34M4T/air.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687943555-92RSWJDJMLSBXBSU20VW/bird-final.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687949080-UG2X9OIH54EZN7YV2LSW/fabric.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687952404-DLN680RNMATBIQ8GA8K6/pill-precomp.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625686392717-C60HP7PJOOW2KQ2953A7/banana.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687947397-L51OLB8Q3GBDD4QKXSAY/crop.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687953993-I703IC5H5F4ZQCTCPD3I/water.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625687948825-BYDFQRILLXLATS06UBIJ/filter.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625686392113-9LIDPV4PYEXKJ1UF5BDP/bandaid.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627858662667-TX7BP479M32PHKS2PL13/BioD-Scans.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629309255999-T5P50ANPZDCEPXXXWV5G/P%2BC_4K-MetricsExplainer.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629312443154-ITR0GDCZZGK3VMQCVUXM/IconExpansion-1.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1628892151726-K3NP9UQ4DCBFUCHEXXFF/DataViz_75.75x43.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629312321934-MVDY98JIZ1ZE33Z4JKL7/IconExpansion-2.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629760863296-Q7661YIP25RJ6117HHVL/SIO-TouchMockup-1.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629759605283-GV1M5IYZ78E4HNLTMBFR/RaccoonReaction.gif Work - Make it stand out Screen recording of our efforts to integrate the animated responses https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625779531140-FMWX79ECUFCOVHPYF429/SIO-DylanSketch.png Work - Make it stand out Dylan’s sketches https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625779565308-GLAIBZQHJS1NZRUO0LBY/SIO-Sketch.png Work - Make it stand out Notes taken during the project kickoff meeting with Exhibits https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625779606796-M8W3J7X7HKRHS9E11G7S/SIO-EarlyMockups.png Work - Make it stand out (Left) The first iteration mockup (Right) To appease our content writers, we introduced a card flip and moved the item’s description to the back of the card. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625782078544-XAJ8LKXXZ0H1ECY5U429/SIO-CharacterSketch.png Work Inexplicably, the worm redesign spontaneously occurred without the need for additional sketching. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625783156956-447RTYO8FAMD9YTIURDK/SIO-Characters.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695114805-VCO4GUXXLVRDYH925FXE/Seagull-Correct.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695112925-M7BAFM8BDILJAEHJUSJZ/Seagull-Incorrect.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695310435-OCOE8OVS0Y75N6TJ93FB/Earthworm-Correct.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695310717-ARWXBUOGZRQ6O8976Z4O/Earthworm-Incorrect.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695313920-YI3CHECTFX7RFQRU34QC/Raccoon-Correct.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695314802-4QREVAWRVA54YJNE0E9B/Raccoon-Incorrect.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625784489963-W8IIA95VP3CBKXBYNXE9/SIO-EarlyBadges.png Work - Make it stand out The placeholder badges of the earlier prototype used the characters themselves. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695633841-4CITRP60JATEIO1MEIOV/Badge-WasteWhiz.png Work - Waste Whiz: awarded for a perfect score on the Landfill section https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695631918-GMU5JAPV8D2ES320GKVE/Badge-CompostConnoisseur.png Work - Compost Connoisseur: awarded for a perfect score on the Compost section https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695633110-GAFKM8IN1UDB6CWE6BVP/Badge-RecyclingRenegade.png Work - Recycling Renegade: awarded for a perfect score on the Recycling section https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695632895-NWPY0R3OJUI60B8MLUHD/Badge-SortingScientist.png Work - Sorting Scientist: awarded for earning two badges https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695631974-XNBP57RJJ9U3Y9NNEMJI/Badge-Perfectionist.png Work - Perfectionist: awarded for earning three badges https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625695633483-HC14Y1N5091L8TF4VHVA/Badge-TopTrasher.png Work - Top Trasher: awarded for earning badges for all three sections https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625785221445-8GN3TQLHYTT4P419MLFP/SIO-Marika.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627899270036-F3LB048QPROO8CK9OLFA/Untitled-2.jpg Work - Make it stand out The projections above the touchscreen kiosks show real-time addition and removal of ingredients. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629217168346-WFQIRRR40L0W58BXULHH/Untitled-1.jpg Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629326728985-W66GXC7LRDTOPWKCWXPS/Screen+Shot+2021-08-18+at+3.43.08+PM.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627884407935-YTMRJBSOZXRWYKSUYDAZ/P%2BC-LogoSketch.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629325349671-WPREJNY9BKUR26N02TOU/P%2BC_Branding-Logo.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629325324461-YHXSHUAWIOWABP24LXBV/P%2BC_Branding-Color.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629325384522-VIYTO86XTTPGI6I0YZV7/P%2BC_Branding-Type.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888609011-8G8NMXXF0C4JPDO47057/Screenshot+%286%29.png Work - Make it stand out The first prototype posed several areas for improvement. Each ingredient card required space for a fun fact, and prototyping sessions indicated the need for graphic visualization of the footprint metrics. Space was the most significant constraint; all touch targets had to reside in the lower two-thirds of the extra large screen for reachability. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888675526-CB6LMKUAIQUWI8QOLVVK/P%2BC-Card-1.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888839292-9U8HZDCWSIO2VNKBBQ2G/Screen+Shot+2021-08-01+at+11.11.25+PM.png Work - Make it stand out My first pass recycled the 3x2 layout, but introduced colored meters to display scales of footprint: 1-2 bars for low impact, 3-4 bars for medium, and 5-6 for high, all relative within each ingredient group (comparing the environmental impact of steak to corn would break the scale). I added color to provide a second mode of visual comparison. The colored meters were well-received, but following issues remained: the text was far too small, and the contrast between the coral and white did not meet accessibility standards. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888697157-A9PAO0SHVOK1HWRQFY65/P%2BC-Card-2.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888934576-1HE59XIRKTQNFAJ7SF4M/Screen+Shot+2021-08-01+at+11.13.19+PM.png Work - Make it stand out Quickly moving on to the next design, I rearranged the layout to a 6x1 grid to allow horizontal comparison of the metrics and easy access to the touch targets. To make space for the challenge mode, I shrunk the header and relocated the instructions to the top left. I also proposed a drop-up card that flipped to show the fun fact on the other side, with icons replacing the text buttons. Unfortunately, testing revealed insufficient padding between the two buttons on the lower right. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888720282-7K6A7876CZL46BI5FSDT/P%2BC-Card-3.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627889071075-IAQCEXAMEIB2BEYBEV0H/Screen+Shot+2021-08-01+at+11.14.36+PM.png Work - Make it stand out While the color scheme and layout were headed in the right direction, the card design remained complex. Here, I entertained the idea of removing the information/back buttons and implementing a carousel-swipe. Our priority was to get users to add ingredients and build at least one meal; the fun fact was optional. We tossed this iteration. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888756349-TBD8N3OAGPAMIEF0AVQB/P%2BC-Card-4.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627889135291-AA6N4V61DV8ZFZRO18TQ/mockup-protein.png Work - Make it stand out Through visitor testing, we learned that users often felt frustrated that the drop-down button was not in the same location as the drop-up; they kept hitting the add button when they intended to close the card. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627888801399-NA5RU60WY78X25C2K4JJ/P%2BC-Card-5.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627892856938-FDWXCRA0LCTKV3CU6IPV/P%2BC-MockupArtboard+2.png Work - Make it stand out The final design incorporated the fictional brand guidelines of Pick + Chews, and addressed the prior user frustrations by placing the drop-up and drop-down buttons in the same location. I also emphasized the add button by making it larger, and moving it to the front and center of the card. In the end, we implemented a tutorial mode at the start of the game to guide the user through the steps of adding an ingredient to their meal. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627895332109-HA3AKPPFZHUD6LAPWPQ3/P%2BC_4K-MetricsExplainer.png Work - Make it stand out I included a screen that contains the same information as the physical signage that accompanies the exhibit. A bath towel illustrates a real-world point of reference, as the signs no longer provide physical scale. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627895253666-L9IBFPRGKRJJPREDGGJY/P%2BC_Signage-Land.png Work - Make it stand out The icons used throughout Pick + Chews, including these physical signs that hang above the kiosks, share the same visual language as the Biodiversity Game. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627895219119-2XO7KF5NPC2GJPGGJEZL/P%2BC_Signage-CO2.png Work - Make it stand out These signs aim to explain the units of measurement for each metric and provide real-world references of scale to visitors. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627895294025-HXFAS4EZMVNKUWFX1P0W/P%2BC_Signage-Water.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627894692277-IPNINYG5BD88A7206BDI/mockup-1stchallenge.png Work - Make it stand out At the end of the first round, the user receives a “receipt” that calculates the total for each metric. A random challenge is generated and offered to the user. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627894469038-IFJ92KV2RMPIPKXKOAA8/P%2BC-MockupArtboard+5.png Work - Make it stand out I decided to include a text label for each metric in the final design. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627892819483-NYKJSRCTIEOLPLU8SMY9/P%2BC-MockupArtboard+6.png Work - Make it stand out Screens during the challenge-mode show a running total of each metric below the ingredients, as well as a reminder of their challenge posted on the top right. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627894636187-8HIHL34R0AOU7L0389TS/mockup-retry.png Work - Make it stand out The receipt at the end of the first challenge has two columns of totals, one for the previous baseline meal and one for the current. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627894501472-6WMPKWM6X7UA4H67IY6E/P%2BC-MockupArtboard+7.png Work - Make it stand out We wanted to graphically represent the net change for each metric by adding another column for up and down arrows. Users can accept as many challenges as they wish, before finishing their session. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629217220100-L9Y6U4NTAPZ39K49O0NB/reopening+%2854+of+78%29.jpg Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627872753107-487XF15ILT944NXJC7V4/P%2BC-1080_072220-3.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627872789273-US0X08RKFO45E4ZNYN9Q/P%2BC-1080_072220-4.png Work - Make it stand out The greatest challenge laid in consolidating the two screens (ingredients and assembly) into one, while ensuring readable text, adequately sized touch targets and a working reactive layout. Whew. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627872620227-F3GDEVEF7EWI236YFDDO/P%2BC-Instructions.gif Work - Make it stand out Animated instructions replace the tutorial at the start of the game. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627873354677-712GW1HVU3JYLLLVXBX5/P%2BC-1080_CardLabel.png Work - Make it stand out I learned how to provide specs in relative units while designing Pick + Chews for the web; I’d like to thank Dylan for his infinite patience. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1627873404756-M2RLTZK3F0YV6SI2CWCZ/P%2BC-4K_Cards.png Work - Make it stand out In contrast, here’s how I gave Mike specs for the gallery version. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/a82e02a0-99d3-443b-abf0-4eb2953d1338/C12_LessonIcons.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/80464e44-516f-4514-a51d-0c23f02db196/C13_Lesson-Icons.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/5619b454-29d0-4dc9-983c-e2cb98e2c4bb/C14_Lesson-Icons.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629228228720-Z1L9NKQHIMGH3996RZDL/TTI-Print_All.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629230129872-7TD1BR2W317H27AVQITY/TTI-VoucherTix_All.png Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629230559941-ZUUGYGV6YCX87LTSLBFU/TTI-BrochureRack.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629231700677-0XMLL3XPXTSPKPGVMCHU/TTI-Ads-New.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629231740695-8L46LEYDGGNFBNK3ICTG/TTI-Ads-Old.png Work - Make it stand out Web banner ads with former The Tech Museum of Innovation branding https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1629231794462-LD5MS680O9JJAO2FN1AE/IMG_9442.jpg Work - Make it stand out Vouchers, before and after applying the new style guide https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625862218395-66GHZ7DLE7VV6UMDL4Q4/TTI-LogoAnim-2000x1000.gif Work https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625862880315-GM3YBXXQU5EOFW9XBFBU/TTI_change-1200x800.gif Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1625862762762-63WJGOUSUOR09MUI3O4W/TTI-SlackEmoji.gif Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/239b5019-7aaa-4928-9a7c-45a242974088/IMG_6794.JPG Work - Make it stand out photos by Meesh https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/ddb0e848-1da9-45f6-be17-c707235d2a53/GTB_LogoAnimation_Citrine_v3.gif Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/39b23790-95de-4e76-8ee7-0a42b730e582/feed.png Work - Make it stand out via Instagram https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/2a38c624-3fc4-462c-85b5-1a3165bfbb81/brand+overview.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/8ad93b64-f7a2-4bb5-9c9c-762309d2f993/GTB_Totes.JPG Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/2d7d9ba9-6ed4-465f-a87c-98aa174a8167/GTB_Hoodie_Man.JPG Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/152c072e-5424-4571-8ae9-fee6b84df861/brand+overview-1.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/08079c12-2130-4337-ba32-016a299e4ec4/print-material.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/54bd5504-d900-415c-92b4-ea7be672a450/website.png Work - Make it stand out via goodtimebarsj.com https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/927312ef-91cb-4e74-9096-ead7442762b7/stories.png Work - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://www.gloriakoh.com/too-real daily 0.75 2024-01-18 https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1515102127851-AIAOQ2M0AO7RP0I70B97/too+real+insta+mockup+gif.gif Too Real https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508181086968-2WX4AL7Y5CQJIZCKKJJR/image-asset.jpeg Too Real https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508180457248-Z8RX76SDMK2KIZ5KGC37/too+real+insta+mockup+gif.gif Too Real https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1508182045107-FUHM9ZEQIAU7YD8J2QU2/image-asset.jpeg Too Real https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1510268804886-ZNWL010PIH2098MPOVY3/image-asset.jpeg Too Real Spotted in the wild in Capitol Hill, Seattle. https://www.gloriakoh.com/20-years-at-the-tech daily 0.75 2024-01-18 https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546924059940-Z90HZNLHEEOQ5UKBXXGT/20th_logo+animation.gif 20 Years at The Tech https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546924138239-G9DXFP8MOX3B3N5MV98Z/20th_animation 20 Years at The Tech https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546921748566-TVDLT85PPRY5NL4PHQRL/20th_candy.jpg 20 Years at The Tech https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546922234451-54H99P275LOTVPC67FYE/20th_backpack 20 Years at The Tech Embroidered backpacks were gifted to staff during our annual holiday party. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546922357606-ZMOWGN1S734OGPUT8ST4/20th_pin 20 Years at The Tech https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546922708000-BRQR5NFWWBU3QWTCG89X/20th_tree2 20 Years at The Tech The Tech Tree-via: a 20-year timeline. The Media + Community team decorated and displayed a tree for Christmas in the Park, an annual holiday tradition in Downtown San Jose. https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546922677536-9SRZWZ80D9ZVWWB9XNRD/20th_tree1 20 Years at The Tech The Tech Studio brought our logo to life by 3D-printing a tree topper. https://www.gloriakoh.com/motion-graphics daily 0.75 2021-09-03 https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1546924059940-Z90HZNLHEEOQ5UKBXXGT/20th_logo+animation.gif Motion Graphics: Appendix https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1630622674918-ZEMDU3FXT2UWISBQOAJX/UFE.gif Motion Graphics: Appendix https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1630622366591-ZY7RMKWHT00Z5V5Y9635/TTC18_snapchat-promo.gif Motion Graphics: Appendix https://www.gloriakoh.com/x-moonshot daily 0.75 2024-02-23 https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/1705537048469-YOEUJTN2LE6RDSU2114G/X-logo.png X, the moonshot factory https://images.squarespace-cdn.com/content/v1/58a520aa03596ea9fc7fa1b6/130f2486-44de-4dd6-b31f-18c274e72672/X-logo.png X, the moonshot factory - Make it stand out Whatever it is, the way you tell your story online can make all the difference. https://www.gloriakoh.com/home daily 1.0 2026-02-23