https://slwong.cargo.site slwong Mon, 26 Jan 2026 07:30:26 +0000 https://slwong.cargo.site en https://slwong.cargo.site/Home Tue, 04 May 2021 07:28:52 +0000 slwong https://slwong.cargo.site/Home https://slwong.cargo.site/QuantDart Wed, 23 Jun 2021 09:08:00 +0000 slwong https://slwong.cargo.site/QuantDart <img width="2410" height="1594" width_o="2410" height_o="1594" data-src="https://freight.cargo.site/t/original/i/a9043a5f205bfddd6b42eaa744fb162f194264b835c56d17fc4b8868f6f60eb2/QD_mockup.png" data-mid="238415835" border="0" src="https://freight.cargo.site/w/1000/i/a9043a5f205bfddd6b42eaa744fb162f194264b835c56d17fc4b8868f6f60eb2/QD_mockup.png" /> QuantDartCrypto exchange platform - uiux The&nbsp;and security. Challenge How might we help beginners to start investing in crypto in an easy, safe, and valuable way? Solution I redesigned the flow, helped implement the new design style guide and branding with the tech development team for the whole revamp for the website and app. I co-wrote the content strategy with the marketing manager for the website, redesigned the website for users to easily understand the business and how to get started to their first crypto investment. I held workshops for user interviews, analyzed the script, and drew insights. After that, I audited the existing website and redesigned the whole flow in order to implement the goals for providing a better experience for beginners. Design Process1. Ideation &amp; Solution Hunting2. Research &amp; Synthesis &nbsp;3. Brand Development4. Architecture &amp; UX Design&nbsp; 5. UI Design &amp; Prototyping6. Go-To-Marketing &amp; Business 7. DevTesting &amp; Handoff ‍ <img width="4171" height="3000" width_o="4171" height_o="3000" data-src="https://freight.cargo.site/t/original/i/ec90cad17e691ad72282c9ad1693f6f27b055557b1d8947f0f3b6e033774afb9/Mobile-App-Screen-Mockups.jpg" data-mid="112115561" border="0" src="https://freight.cargo.site/w/1000/i/ec90cad17e691ad72282c9ad1693f6f27b055557b1d8947f0f3b6e033774afb9/Mobile-App-Screen-Mockups.jpg" /> <img width="4320" height="10320" width_o="4320" height_o="10320" data-src="https://freight.cargo.site/t/original/i/d0a24a40d88acf6b50911af1dc458e81ea4d98f80c1ca4e0192b245bc20298c8/style-guide.png" data-mid="112115836" border="0" src="https://freight.cargo.site/w/1000/i/d0a24a40d88acf6b50911af1dc458e81ea4d98f80c1ca4e0192b245bc20298c8/style-guide.png" /> &nbsp; &nbsp; <img width="1920" height="1540" width_o="1920" height_o="1540" data-src="https://freight.cargo.site/t/original/i/51ecd528cfc667b3fc1569861013e6e9427c49e39c2a324380a278c5c486412d/ui.png" data-mid="142310429" border="0" src="https://freight.cargo.site/w/1000/i/51ecd528cfc667b3fc1569861013e6e9427c49e39c2a324380a278c5c486412d/ui.png" /> <img width="4320" height="7844" width_o="4320" height_o="7844" data-src="https://freight.cargo.site/t/original/i/3ea239787b79adf3a7221b22eac09d70d33c9632963b93308f64e9de0ead1092/landing-mockup-.jpg" data-mid="112116734" border="0" src="https://freight.cargo.site/w/1000/i/3ea239787b79adf3a7221b22eac09d70d33c9632963b93308f64e9de0ead1092/landing-mockup-.jpg" /><img width="1755" height="1241" width_o="1755" height_o="1241" data-src="https://freight.cargo.site/t/original/i/42f4cb41bf61ae16ab7cd78924bd9ca119d2c610eb0f248aa60cb4ecd9bab83f/crypto_illustration-07.png" data-mid="112117346" border="0" src="https://freight.cargo.site/w/1000/i/42f4cb41bf61ae16ab7cd78924bd9ca119d2c610eb0f248aa60cb4ecd9bab83f/crypto_illustration-07.png" /> <img width="1755" height="1242" width_o="1755" height_o="1242" data-src="https://freight.cargo.site/t/original/i/436a00fa7dde295b39cf66fe577906c047db344d41b5262a175d356936f5f2b3/crypto_illustration-12.png" data-mid="112117344" border="0" src="https://freight.cargo.site/w/1000/i/436a00fa7dde295b39cf66fe577906c047db344d41b5262a175d356936f5f2b3/crypto_illustration-12.png" /><img width="1754" height="1242" width_o="1754" height_o="1242" data-src="https://freight.cargo.site/t/original/i/26aff5413bb2ac6c9c8de5af09f05d272302656eec9990408da12bee0d07a4fa/crypto_illustration-11.png" data-mid="112117345" border="0" src="https://freight.cargo.site/w/1000/i/26aff5413bb2ac6c9c8de5af09f05d272302656eec9990408da12bee0d07a4fa/crypto_illustration-11.png" /><img width="1754" height="1241" width_o="1754" height_o="1241" data-src="https://freight.cargo.site/t/original/i/32a494ca600a8c815e21b3da82e4b77cf5af87a0f1073092747a62d7be1356a8/crypto_illustration-06.png" data-mid="112117348" border="0" src="https://freight.cargo.site/w/1000/i/32a494ca600a8c815e21b3da82e4b77cf5af87a0f1073092747a62d7be1356a8/crypto_illustration-06.png" /> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img width="1024" height="512" width_o="1024" height_o="512" data-src="https://freight.cargo.site/t/original/i/c7fddede95e458d66acef76acd827f182b3ea5adc964e1d81beaceedf98a9652/twitter-2.jpg" data-mid="112117813" border="0" src="https://freight.cargo.site/w/1000/i/c7fddede95e458d66acef76acd827f182b3ea5adc964e1d81beaceedf98a9652/twitter-2.jpg" /> &nbsp; &nbsp; <img width="1400" height="1100" width_o="1400" height_o="1100" data-src="https://freight.cargo.site/t/original/i/49021496cb2cea2fb8fa65860949fbb7ce989e4eb4aa54fb7f0fb70c778af53d/enagement.png" data-mid="112118028" border="0" src="https://freight.cargo.site/w/1000/i/49021496cb2cea2fb8fa65860949fbb7ce989e4eb4aa54fb7f0fb70c778af53d/enagement.png" /> https://slwong.cargo.site/Artzioneer-NFT-platform Thu, 14 Apr 2022 11:49:31 +0000 slwong https://slwong.cargo.site/Artzioneer-NFT-platform <img width="2410" height="1464" width_o="2410" height_o="1464" data-src="https://freight.cargo.site/t/original/i/ec3433112969e1683be65d4a8ca942abbf2d2c251de142e67c5cae57e68118ff/Artzioneer---NFTs-platform.png" data-mid="238415799" border="0" src="https://freight.cargo.site/w/1000/i/ec3433112969e1683be65d4a8ca942abbf2d2c251de142e67c5cae57e68118ff/Artzioneer---NFTs-platform.png" /> Artzioneer&nbsp; NFT platform - uiux&nbsp; The proposal Artzioneer is a new one-stop NFT marketplace which focuses on building a community of art, self-expression, and imagination. We aim to create avant-garde and creative NFT projects for all creators from which to build a new bohemian metaverse of artistic self-reliance. Challenge How might we connect brands, artists and creators to rediscover the creative potential with NFTs? Key objective Artzioneer provides platform for artists &amp; brands selling NFTs alongside with our tailor-made campaign. Buyers can trade &amp; redeem valuable NFTs through our platform. Solution From research and ideation to UI and platform launch implementation, I design Artzioneer landing page and marketplace to allow users to understand our platform, easily get start their own account and browse the NFTs. My role Business strategy, UXUI lead, Branding https://www.artzioneer.com/ <img width="1442" height="8814" width_o="1442" height_o="8814" data-src="https://freight.cargo.site/t/original/i/b8db2acb9744dfae41078ce51d1aa38345fb98682bb59a8f8ccc55e54013d9e3/homepage.png" data-mid="142365439" border="0" src="https://freight.cargo.site/w/1000/i/b8db2acb9744dfae41078ce51d1aa38345fb98682bb59a8f8ccc55e54013d9e3/homepage.png" /> <img width="1080" height="982" width_o="1080" height_o="982" data-src="https://freight.cargo.site/t/original/i/242ad237bbbc9d3f3fddb8b7f7e999abe9cc9b3832824d9f9063e32e0171fd0d/a.png" data-mid="142370702" border="0" data-scale="77" src="https://freight.cargo.site/w/1000/i/242ad237bbbc9d3f3fddb8b7f7e999abe9cc9b3832824d9f9063e32e0171fd0d/a.png" /> &nbsp; &nbsp; https://slwong.cargo.site/The-Henderson Wed, 05 Jun 2024 01:57:40 +0000 slwong https://slwong.cargo.site/The-Henderson <img width="1144" height="700" width_o="1144" height_o="700" data-src="https://freight.cargo.site/t/original/i/663b029a1e730f0ca838844dbf5a3858c920864139159dbfcee0c926b8446cf6/thehenderson.jpeg" data-mid="212331404" border="0" src="https://freight.cargo.site/w/1000/i/663b029a1e730f0ca838844dbf5a3858c920864139159dbfcee0c926b8446cf6/thehenderson.jpeg" />The Henderson Mobile app, Tenant Admin portal &amp; Operational Dashboard development Sector Real Estate Challenge To cater to the daily needs of guests, visitors, tenants, administrators, and building management, we have designed an app and web portal that delivers a seamless digital experience within the building. The whole project includes 17 modules &amp; 3 MVPs.&nbsp; My Role User Research, Persona creation, Information architecture, user flow &amp; wireflow creation, Business/ Tech requirement validation, Client-facing User Interview User Interviews - Conducted 4 different interviews with staff of various roles currently working at The Henderson, including Tenant, an Administrator, Leasing Manager, and Facilities Manager. Translated the user research insights into detailed user personas and usage scenarios. <img width="1446" height="1454" width_o="1446" height_o="1454" data-src="https://freight.cargo.site/t/original/i/f454f06c360b1eecafacadf9c87dd22ddd45ebba8e25cc13bd997f2f48a068de/user-interview_all.png" data-mid="212335141" border="0" src="https://freight.cargo.site/w/1000/i/f454f06c360b1eecafacadf9c87dd22ddd45ebba8e25cc13bd997f2f48a068de/user-interview_all.png" /> Persona Persona Creation -&nbsp;Based on the new product roles, I created 7 detailed user personas. I divided the roles into distinct behavioral profiles to reflect the varied priorities and needs. For example, take Lisa and Chris. Lisa is a CFO and VIP tenant who leads a busy lifestyle. She is a frequent user of the smart parking features and has higher expectations compared to other users. In contrast, Chris is a mid-level manager with a strong focus on ESG (environmental, social, and governance) initiatives. He is willing to engage more to earn ESG rewards and pays close attention to environmental controls. These personalized scenarios helped prioritize key functions when building the app or portal. Developing these user personas ensured a user-centric approach to the app design and development. <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/b604938eda02e867974736c73a85afba45a3d87dfafc93ed4cac3a1084050f46/Guest---Alex-Chu.jpg" data-mid="212335454" border="0" src="https://freight.cargo.site/w/1000/i/b604938eda02e867974736c73a85afba45a3d87dfafc93ed4cac3a1084050f46/Guest---Alex-Chu.jpg" /> <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/06c097d3319541b20db057b6d2c404316a115a0f6120d8ed895690de4148d2be/HLD-admin---Iris-Lee---Platform---leasing-Management.jpg" data-mid="212335466" border="0" src="https://freight.cargo.site/w/1000/i/06c097d3319541b20db057b6d2c404316a115a0f6120d8ed895690de4148d2be/HLD-admin---Iris-Lee---Platform---leasing-Management.jpg" /> <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/9a33dde93486dd60ddc4fa802f759a7e0dd1261d4baeeb92381480a21fdca4a6/HLD-admin---Chris-Cheung---PMC.jpg" data-mid="212335457" border="0" src="https://freight.cargo.site/w/1000/i/9a33dde93486dd60ddc4fa802f759a7e0dd1261d4baeeb92381480a21fdca4a6/HLD-admin---Chris-Cheung---PMC.jpg" /> <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/6305d0bfd5bed8dea0ec10a83ff6877291264e9137d73d6c780a745fe3ed56b2/Tenant-admin---Fiona-Lam.jpg" data-mid="212335470" border="0" src="https://freight.cargo.site/w/1000/i/6305d0bfd5bed8dea0ec10a83ff6877291264e9137d73d6c780a745fe3ed56b2/Tenant-admin---Fiona-Lam.jpg" /> <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/4036e61915c735e89f04dff569b786631c9fe7702bfb0a83e2a90d2b86b30efd/Tenant---Sarah-Chen.jpg" data-mid="212335469" border="0" src="https://freight.cargo.site/w/1000/i/4036e61915c735e89f04dff569b786631c9fe7702bfb0a83e2a90d2b86b30efd/Tenant---Sarah-Chen.jpg" /> <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/2e1172238533b78174d571f48124444054a3d70868c02da903bdf77df1a74286/Tenant---Lisa-Wong.jpg" data-mid="212335468" border="0" src="https://freight.cargo.site/w/1000/i/2e1172238533b78174d571f48124444054a3d70868c02da903bdf77df1a74286/Tenant---Lisa-Wong.jpg" /> <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/7e0296231314172ad6218a8d7efe0e27d07091ac65e0c83ef710a8a9614a9e88/Tenant---Ben-Leung.jpg" data-mid="212335467" border="0" src="https://freight.cargo.site/w/1000/i/7e0296231314172ad6218a8d7efe0e27d07091ac65e0c83ef710a8a9614a9e88/Tenant---Ben-Leung.jpg" /> Customer Journey&nbsp; ESG focused - Recycle by using vending machineThrough an empathy-driven user experience design approach, we were able to deeply understand the motivations and behaviors of our target customer, Ben, as he navigated the reverse vending machine (RVM) recycling program in his local Henderson community. Ben is an environmentally-conscious individual who is highly motivated to reduce his carbon footprint and do more to protect the planet. At the same time, he is also enthusiastic about earning rewards, in the form of the Hendcoin, through his participation in the company's sustainability initiatives. Our research revealed that the combination of daily recycling missions, ongoing ESG program promotions, and the convenient proximity of the RVM locations were key factors that not only initially attracted Ben to the program, but also encouraged his consistent, habitual use of the reverse vending machines over time. The ability to earn cash rebates from the RVMs provided an added financial incentive that further reinforced Ben's recycling behaviors. By deeply understanding Ben's environmental values, his desire for tangible rewards, and the contextual factors that influenced his actions, we were able to design a customer journey that seamlessly aligned with his needs and preferences. The result was an engaging, empowering, and rewarding recycling experience that transformed Ben's sustainability efforts into an integral part of his daily routine. <img width="2526" height="1785" width_o="2526" height_o="1785" data-src="https://freight.cargo.site/t/original/i/17a3672d54a44aaf1cfc340484931651a136219e0648efa1a72b9646803133c1/Customer-journery.png" data-mid="213040743" border="0" src="https://freight.cargo.site/w/1000/i/17a3672d54a44aaf1cfc340484931651a136219e0648efa1a72b9646803133c1/Customer-journery.png" />Information Architecture Mobile App Information Architecture DesignAs the lead on the mobile app information architecture (IA), I developed a structured hierarchy consisting of pages, main sections, features, and action buttons. The solid lines represent the page content, while the dashed lines depict the navigation flow. Creating this IA helped establish a common understanding between the business, tech, and design teams. It ensured consistency in applying key design patterns, such as navigation, bottom sheets, and pop-ups, across the app experience. By defining this clear IA framework upfront, we were able to align stakeholders, streamline the development process, and maintain a cohesive user experience throughout the app. <img width="14829" height="17733" width_o="14829" height_o="17733" data-src="https://freight.cargo.site/t/original/i/b8e9ffb720f0914305cd2327c275042664f080e0794e1f7ba7ab1e74fc0aea3a/v2.jpg" data-mid="212335831" border="0" src="https://freight.cargo.site/w/1000/i/b8e9ffb720f0914305cd2327c275042664f080e0794e1f7ba7ab1e74fc0aea3a/v2.jpg" /> <img width="3028" height="836" width_o="3028" height_o="836" data-src="https://freight.cargo.site/t/original/i/d79f71b915aef762f0674a7e7c52459896513d15541d75977add9be240fa1327/HLD-IA-all.png" data-mid="212335928" border="0" src="https://freight.cargo.site/w/1000/i/d79f71b915aef762f0674a7e7c52459896513d15541d75977add9be240fa1327/HLD-IA-all.png" /> User Flow &amp; Wireframe Food &amp; beverage&nbsp; Business/ Technical requirement validation The first step of our process involves business and technical validation. I reviewed the requirements and benchmarked the best industry practices. This validation step ensured the proposed flow and requirements were user-centric, focusing on both usability and technical feasibility. <img width="2596" height="3808" width_o="2596" height_o="3808" data-src="https://freight.cargo.site/t/original/i/a493e55872faf188316f40edadc7f038390f7258dc14ea7e95b4fdbdc847c121/IMG_4746.png" data-mid="212342678" border="0" src="https://freight.cargo.site/w/1000/i/a493e55872faf188316f40edadc7f038390f7258dc14ea7e95b4fdbdc847c121/IMG_4746.png" /> <img width="2720" height="3802" width_o="2720" height_o="3802" data-src="https://freight.cargo.site/t/original/i/e52ea032492245d704943ac090a531e292ffe74ccb1c9550765bea0c25a622e4/IMG_4747.png" data-mid="212342679" border="0" src="https://freight.cargo.site/w/1000/i/e52ea032492245d704943ac090a531e292ffe74ccb1c9550765bea0c25a622e4/IMG_4747.png" /> User flow design I designed the user flow, incorporating elements such as in-app navigation, user decision points, user control mechanisms, and error handling. Additionally, I created a chart illustrating the interactions between notifications, client actions, restaurant actions, and third-party integrations. This visual aid was intended to facilitate better communication and alignment across the team. <img width="10040" height="16397" width_o="10040" height_o="16397" data-src="https://freight.cargo.site/t/original/i/531b1d1ffdbf9f1dc1d2e0abbd58a98f5e66c11433abf6db2309edba1dabcf30/user-flow---4.1.2-1.jpg" data-mid="212336038" border="0" src="https://freight.cargo.site/w/1000/i/531b1d1ffdbf9f1dc1d2e0abbd58a98f5e66c11433abf6db2309edba1dabcf30/user-flow---4.1.2-1.jpg" /> Wireframe Design I designed one of the sections using a sketch-based approach. This method allowed for quickly illustrating ideas and putting them into team discussions for feedback and validation. <img width="3910" height="2754" width_o="3910" height_o="2754" data-src="https://freight.cargo.site/t/original/i/728c9c22a9f422cac2e829f0b8f3058605fc992d63cd8cbb0ff1d33992203ea9/IMG_4749.png" data-mid="212343242" border="0" src="https://freight.cargo.site/w/1000/i/728c9c22a9f422cac2e829f0b8f3058605fc992d63cd8cbb0ff1d33992203ea9/IMG_4749.png" /> <img width="3916" height="2760" width_o="3916" height_o="2760" data-src="https://freight.cargo.site/t/original/i/31da2140cbea80597fcdeb199497822a1c27e6f981c00de05b8600276557e920/IMG_4748.png" data-mid="212343241" border="0" src="https://freight.cargo.site/w/1000/i/31da2140cbea80597fcdeb199497822a1c27e6f981c00de05b8600276557e920/IMG_4748.png" /> <img width="3802" height="2728" width_o="3802" height_o="2728" data-src="https://freight.cargo.site/t/original/i/0e061c78a47d88c0b3e0a664000cde12da5462c4c0cae807f0235557aa832eba/IMG_4750.png" data-mid="212343243" border="0" src="https://freight.cargo.site/w/1000/i/0e061c78a47d88c0b3e0a664000cde12da5462c4c0cae807f0235557aa832eba/IMG_4750.png" /> <img width="3788" height="2680" width_o="3788" height_o="2680" data-src="https://freight.cargo.site/t/original/i/bd66449d9ff6a9ded0b9e7b7a27cb7ec3c88e4f0052b66b0847e09a473ee6cf3/IMG_4751.png" data-mid="212343244" border="0" src="https://freight.cargo.site/w/1000/i/bd66449d9ff6a9ded0b9e7b7a27cb7ec3c88e4f0052b66b0847e09a473ee6cf3/IMG_4751.png" /> <img width="3938" height="2766" width_o="3938" height_o="2766" data-src="https://freight.cargo.site/t/original/i/7d968af25702701dced6d75c095dc80b179e18cfec63411733d28b62c6a94a57/IMG_4752.png" data-mid="212343910" border="0" src="https://freight.cargo.site/w/1000/i/7d968af25702701dced6d75c095dc80b179e18cfec63411733d28b62c6a94a57/IMG_4752.png" /> UI Design After the UX design process, I handed off the work to the UI team. In this subsequent phase, my role was to monitor the progress, provide UI enhancements, and ensure the UX flow and microcopy were properly aligned. <img width="19300" height="10226" width_o="19300" height_o="10226" data-src="https://freight.cargo.site/t/original/i/5a78fb74c62767a92e6065ff8176c6afaf2da3854db1347031e256d0caa47d75/4.1.2.1-In-building-Catering_s.jpg" data-mid="212344181" border="0" src="https://freight.cargo.site/w/1000/i/5a78fb74c62767a92e6065ff8176c6afaf2da3854db1347031e256d0caa47d75/4.1.2.1-In-building-Catering_s.jpg" /> <img width="786" height="2046" width_o="786" height_o="2046" data-src="https://freight.cargo.site/t/original/i/7b5796073892a55449ce20b7bfac58d99429a894873ee757584eb668029a871e/In-Building-Catering-246.jpg" data-mid="212344178" border="0" src="https://freight.cargo.site/w/786/i/7b5796073892a55449ce20b7bfac58d99429a894873ee757584eb668029a871e/In-Building-Catering-246.jpg" /> <img width="786" height="1704" width_o="786" height_o="1704" data-src="https://freight.cargo.site/t/original/i/4f7e7638227cc0a601eab15445f3e0299938cf31493f2109dcced765c6f1f8e1/In-Building-Catering-269.jpg" data-mid="212344179" border="0" src="https://freight.cargo.site/w/786/i/4f7e7638227cc0a601eab15445f3e0299938cf31493f2109dcced765c6f1f8e1/In-Building-Catering-269.jpg" /> <img width="786" height="1704" width_o="786" height_o="1704" data-src="https://freight.cargo.site/t/original/i/2c441d3940cc9d6bf4623fb637e227c88895207971161fe5efd459acb400d458/In-Building-Catering-301.jpg" data-mid="212344180" border="0" src="https://freight.cargo.site/w/786/i/2c441d3940cc9d6bf4623fb637e227c88895207971161fe5efd459acb400d458/In-Building-Catering-301.jpg" /> https://slwong.cargo.site/Bullish Wed, 17 Sep 2025 08:54:21 +0000 slwong https://slwong.cargo.site/Bullish <img width="11478" height="6957" width_o="11478" height_o="6957" data-src="https://freight.cargo.site/t/original/i/6b89560c4f44b0683f1ee4a9aaf7a45d7641d184ad5d3d97a95f47bc00c83964/Bullish-OTC_1.png" data-mid="238318787" border="0" src="https://freight.cargo.site/w/1000/i/6b89560c4f44b0683f1ee4a9aaf7a45d7641d184ad5d3d97a95f47bc00c83964/Bullish-OTC_1.png" /> Bullish OTC Trade Builder - UI/UX The proposal Designing a tool tailored for pro-traders to facilitate over-the-counter (OTC) trading, enabling seamless execution of high-volume transactions across various products and strategies through direct interactions with other traders. My Role UX flow design, User interface design, Business/ Tech requirement validation Tools Figma, Figjam &nbsp; Product Link Challenge: &nbsp; How might we design a tool tailored for pro-traders to facilitate over-the-counter (OTC) trading, enabling seamless execution of high-volume transactions across various products and strategies through direct interactions with other traders? Feature Brief The OTC UI provides a user interface to all the functionality provided by the OTC Trade facility. The primary features are: OTC Booking UI: Provides an interface for users to book an OTC trade OTC Match Blotter: View a live blotter of users’ OTC trades and status OTC Positions: View all OTC positions held at Bullish OTC Trades: View the history of OTC trade bookings and trade legs 1. Market Research OTC vs RFQ Trading - Market Insight:In the current market, tools for Over-The-Counter (OTC) trading are limited, especially for pro traders. Instead, Request for Quote (RFQ) systems are more commonly used—particularly by retail clients. Below is a comparison highlighting the key differences between OTC trading and RFQ: <img width="2610" height="1536" width_o="2610" height_o="1536" data-src="https://freight.cargo.site/t/original/i/136a7d475864da80072e142def35d8fb70eb647c6c86545c950f2066e62ad9dc/OTC-RFQ-comparsion.png" data-mid="238319361" border="0" src="https://freight.cargo.site/w/1000/i/136a7d475864da80072e142def35d8fb70eb647c6c86545c950f2066e62ad9dc/OTC-RFQ-comparsion.png" />2. Competitive Analysis&nbsp; Derbit &amp;&nbsp;Binance flow, features, UIUX analysis - I analyzed the RFQ functions of two key industry players: Deribit (a leader in options and futures trading) and Binance (a leading retail crypto exchange). The review focused on their trading flows, feature sets, and included a UI/UX analysis to identify best practices and gaps. <img width="12672" height="15136" width_o="12672" height_o="15136" data-src="https://freight.cargo.site/t/original/i/9d9eff4890a04c1067ee29764de1d3121213aa31ff0d3b280c8406e9473340ce/competitoranalysis.png" data-mid="238319476" border="0" src="https://freight.cargo.site/w/1000/i/9d9eff4890a04c1067ee29764de1d3121213aa31ff0d3b280c8406e9473340ce/competitoranalysis.png" /> 3. Design Approach Existing modal Audition(Bullish) -&nbsp;Identifying reusable design patterns to implement new functions across the platform — ensuring UI/UX consistency while reducing development effort and improving scalability. <img width="2710" height="1661" width_o="2710" height_o="1661" data-src="https://freight.cargo.site/t/original/i/fefff65c3d61c86d4338ed28b018ce112227b1022b942e74fb65efe8ba670005/research-bullish2.png" data-mid="238319751" border="0" src="https://freight.cargo.site/w/1000/i/fefff65c3d61c86d4338ed28b018ce112227b1022b942e74fb65efe8ba670005/research-bullish2.png" />4. Design Process:Ecosystem Flow Design Process -&nbsp; I began by designing the overall user flow to understand how the ecosystem functions when a trade order is initiated within the OTC Trade Builder. <img width="2034" height="1008" width_o="2034" height_o="1008" data-src="https://freight.cargo.site/t/original/i/844ca4457eea778b8b8a60fd64246fba1c936f5e06ad378c28b24be20f5a734c/Orderflow.png" data-mid="238321842" border="0" src="https://freight.cargo.site/w/1000/i/844ca4457eea778b8b8a60fd64246fba1c936f5e06ad378c28b24be20f5a734c/Orderflow.png" /> Trader Builder Flow Design Process - I conducted a deep dive into the Cornea flow, detailing how users can construct a trade, add legs, simulate amount and risk, submit, and cancel orders within the interface. <img width="3392" height="8896" width_o="3392" height_o="8896" data-src="https://freight.cargo.site/t/original/i/8491f3490101af4eb0938aa8e654ef58537c48bc21b41a051f5087e207324635/Corneaflow.png" data-mid="238321883" border="0" src="https://freight.cargo.site/w/1000/i/8491f3490101af4eb0938aa8e654ef58537c48bc21b41a051f5087e207324635/Corneaflow.png" />Wireframe Exploration: Builder structure - I designed multiple wireframe options to help the business and development teams evaluate different structural approaches for the OTC Trade Builder: Option 1: "Partial Reveal" – Optimized for a more engaging experience by progressively disclosing information, helping users manage complexity and reduce information overload. Option 2: "Parallel Design" – Focused on efficiency, allowing traders to view and compare multiple trade components side by side to support faster decision-making.Final Structure Design Decision:The final approach reflects a constructive trade-off between business goals and stakeholder feedback, with a clear priority placed on streamlining the trade construction process to best support user needs and strategic objectives. <img width="8128" height="8742" width_o="8128" height_o="8742" data-src="https://freight.cargo.site/t/original/i/30537171e41a3a2af1cdf2441a8b20b77f3e8385fdeea51f3b1ab0b78a9a4577/Wirframe.png" data-mid="238322805" border="0" src="https://freight.cargo.site/w/1000/i/30537171e41a3a2af1cdf2441a8b20b77f3e8385fdeea51f3b1ab0b78a9a4577/Wirframe.png" /> UI design:&nbsp; Screen Flow Design-I designed responsive desktop, tablet, and mobile versions of the OTC Trade Builder to ensure seamless Day 1 adoption across all key platforms and user environments. <img width="32768" height="12267" width_o="32768" height_o="12267" data-src="https://freight.cargo.site/t/original/i/0a30bdcd4208c7ff9004bd9cd054b1616eed666fae63cdfc045e361c66156ea7/Trade-Builder---desktop.png" data-mid="238324345" border="0" src="https://freight.cargo.site/w/1000/i/0a30bdcd4208c7ff9004bd9cd054b1616eed666fae63cdfc045e361c66156ea7/Trade-Builder---desktop.png" /> <img width="22245" height="19491" width_o="22245" height_o="19491" data-src="https://freight.cargo.site/t/original/i/ee0c9613e9ffdd00a6c290c21205b511444bf72c189a0092b60585602be43d4a/Trade-Builder---Mobile.png" data-mid="238324344" border="0" src="https://freight.cargo.site/w/1000/i/ee0c9613e9ffdd00a6c290c21205b511444bf72c189a0092b60585602be43d4a/Trade-Builder---Mobile.png" />Extreme Case Design - &nbsp; Button and Data Overload in One RowObjectiveTo test the limits of usability and visual clarity when an interface row must display: Multiple action buttons High-volume data fields Limited horizontal space in mobile Design Considerations Action PrioritizationUse of space-saving patterns (iconography) Use of a long-press&nbsp;gesture for the device <img width="6452" height="3570" width_o="6452" height_o="3570" data-src="https://freight.cargo.site/t/original/i/d9bcdb215e73bcf438dcda61911df0fc782baaf5ccc647b7176edb1c616a5feb/Extreme-Case-Design.png" data-mid="238934146" border="0" src="https://freight.cargo.site/w/1000/i/d9bcdb215e73bcf438dcda61911df0fc782baaf5ccc647b7176edb1c616a5feb/Extreme-Case-Design.png" /> Agile Collaboration: Future version (Adding trade with strategies) -&nbsp;Following an agile approach, I typically provide multiple design versions to support the development team’s adaptation, aligning with their implementation timelines and sprint goals. <img width="3102" height="2100" width_o="3102" height_o="2100" data-src="https://freight.cargo.site/t/original/i/3cc32827ac6169aaf274bcd80aa51ff6878d1d9e756cfafe3813d4f574fd1e07/OTC_future_mockup.png" data-mid="238324595" border="0" src="https://freight.cargo.site/w/1000/i/3cc32827ac6169aaf274bcd80aa51ff6878d1d9e756cfafe3813d4f574fd1e07/OTC_future_mockup.png" /> Launched: Sep 2025 |&nbsp;Product Link https://slwong.cargo.site/RevoSurge Tue, 20 Jan 2026 02:39:21 +0000 slwong https://slwong.cargo.site/RevoSurge <img width="4000" height="3000" width_o="4000" height_o="3000" data-src="https://freight.cargo.site/t/original/i/0a1856a8db90147ea198fc6b6ed6bcad4d6e9dd4c749769d3becb58d6af46187/RevoSurge_szelokportfolio_Datapulse.jpeg" data-mid="243590241" border="0" src="https://freight.cargo.site/w/1000/i/0a1856a8db90147ea198fc6b6ed6bcad4d6e9dd4c749769d3becb58d6af46187/RevoSurge_szelokportfolio_Datapulse.jpeg" /> <img width="2000" height="1500" width_o="2000" height_o="1500" data-src="https://freight.cargo.site/t/original/i/cf5962e8d212b683dd6ae74d2ac6b7cde2eb8c1a3b1b416711b35251176305f1/mockuuups-macbook-air-mockup-on-a-textured-stone-surface.jpeg" data-mid="243781495" border="0" src="https://freight.cargo.site/w/1000/i/cf5962e8d212b683dd6ae74d2ac6b7cde2eb8c1a3b1b416711b35251176305f1/mockuuups-macbook-air-mockup-on-a-textured-stone-surface.jpeg" /> RevoSurge AI-Powered DSP - UI/UX The proposal I designed an AI-powered ad-buy and analytics platform that simplifies ad campaign management, making it intuitive, efficient, and results-driven. Tailored for media-buying executives of all experience levels, it empowers users to achieve optimal outcomes with ease. My Role Lead UI/UX Designer -&nbsp;UX research, UX flow design, User interface design, Business/ Tech requirement validation Timeline3 months Tools Figma, Figjam &nbsp; Challenge: &nbsp; "How might we revolutionize the ad-buy process by crafting an intuitive, user-centric experience that empowers users with intelligent, real-time AI-driven insights—enabling smarter, faster, and more confident decision-making?" Project Brief Designing two interconnected platforms that empower users to streamline the ad-buy process, optimize campaigns, and gain actionable insights. The goal is to enable quick decision-making and iterative improvements, creating a continuous cycle of optimization and recurring profitability.Beta Version -&nbsp;"A foundational, scalable platform with a simple yet actionable workflow, powered by lightweight AI functionality to deliver immediate value while laying the groundwork for future growth." Discovery phase -&nbsp;1. PRD &amp; existing screens audition&nbsp; I utilized flowcharts to audit the Product Requirements Document (PRD) for clarity and alignment. Additionally, I reviewed the screens developed by the dev team, ensuring consistency with the design vision, while auditing data structures and site architecture for usability and functionality. <img width="2336" height="1248" width_o="2336" height_o="1248" data-src="https://freight.cargo.site/t/original/i/dc2f858e47a3802c3788d0fdd4827d017e2181b100c32a968c7bbecd9e2447c8/PRD_audition.png" data-mid="243616923" border="0" src="https://freight.cargo.site/w/1000/i/dc2f858e47a3802c3788d0fdd4827d017e2181b100c32a968c7bbecd9e2447c8/PRD_audition.png" /> <img width="5664" height="2976" width_o="5664" height_o="2976" data-src="https://freight.cargo.site/t/original/i/07d8f8e1c3656630649664c751b4c63b41365dc9e05332ac22310bd27cf06610/Audition_Datapulse.png" data-mid="243616901" border="0" src="https://freight.cargo.site/w/1000/i/07d8f8e1c3656630649664c751b4c63b41365dc9e05332ac22310bd27cf06610/Audition_Datapulse.png" /><img width="5664" height="2976" width_o="5664" height_o="2976" data-src="https://freight.cargo.site/t/original/i/1720eaf08b375ae8465fce1efefd709c6642c21cc2771c0e6959653a2b8ac3e8/Audition_Adwave.png" data-mid="243616900" border="0" src="https://freight.cargo.site/w/1000/i/1720eaf08b375ae8465fce1efefd709c6642c21cc2771c0e6959653a2b8ac3e8/Audition_Adwave.png" /> Discovery phase - 2. Competitive Analysis&nbsp; <img width="2656" height="1568" width_o="2656" height_o="1568" data-src="https://freight.cargo.site/t/original/i/d3dc4dcc6b8e9eaaf88e58cdd3fed973d2e9fe65781ab6802b259d013f0ed7d6/aivstrad.png" data-mid="243698485" border="0" src="https://freight.cargo.site/w/1000/i/d3dc4dcc6b8e9eaaf88e58cdd3fed973d2e9fe65781ab6802b259d013f0ed7d6/aivstrad.png" /> Skai &amp;&nbsp;Axon flow, features, UIUX analysis (Create campaign flow) - I conducted a detailed analysis of the 'Create Campaign' functionality of two key industry players: Skai, a leader in omnichannel marketing, and Axon AI, a market leader in mobile and performance advertising as of 2026. This review focused on their campaign creation flow, incorporating a UI/UX evaluation to identify best practices and uncover gaps in AI integration. <img width="10994" height="11808" width_o="10994" height_o="11808" data-src="https://freight.cargo.site/t/original/i/968dc3c66951713b06a6e809f3c96fd93e2a1ad3f4fa007dc5674ab3b7cfe0f7/skai-flow.png" data-mid="243704211" border="0" src="https://freight.cargo.site/w/1000/i/968dc3c66951713b06a6e809f3c96fd93e2a1ad3f4fa007dc5674ab3b7cfe0f7/skai-flow.png" /> <img width="10688" height="7232" width_o="10688" height_o="7232" data-src="https://freight.cargo.site/t/original/i/8dff5b1af0c7c3251ee5a94a97d26ecb4ba228f3d2815ff9af05e9992168ddda/axonai.png" data-mid="243704210" border="0" src="https://freight.cargo.site/w/1000/i/8dff5b1af0c7c3251ee5a94a97d26ecb4ba228f3d2815ff9af05e9992168ddda/axonai.png" /> 3. Design Process:IA &amp; ecosystem Design - I started by designing the Information Architecture (IA) and ecosystem flow to align the team's vision, streamline the breakdown of work scope, and ensure seamless navigation for an intuitive user experience. <img width="5408" height="3072" width_o="5408" height_o="3072" data-src="https://freight.cargo.site/t/original/i/10faa4937a31afab46407413f7b7088a4c1d453483f0b8ee536ffecf998d5b0d/ecosystme-chart.png" data-mid="243704346" border="0" src="https://freight.cargo.site/w/1000/i/10faa4937a31afab46407413f7b7088a4c1d453483f0b8ee536ffecf998d5b0d/ecosystme-chart.png" /> <img width="10048" height="2272" width_o="10048" height_o="2272" data-src="https://freight.cargo.site/t/original/i/ac79e0d0a792bfd46a6b9aafee90cf6be52e5095d841dc07f53f3ea008179533/IA-adwave.png" data-mid="243704347" border="0" src="https://freight.cargo.site/w/1000/i/ac79e0d0a792bfd46a6b9aafee90cf6be52e5095d841dc07f53f3ea008179533/IA-adwave.png" /> <img width="8928" height="2336" width_o="8928" height_o="2336" data-src="https://freight.cargo.site/t/original/i/e718ecdd0bd1d89c4df62cf7a88b4462c7b3a1a0359d1b40247a9aac7a156670/IA-datapulse.png" data-mid="243704348" border="0" src="https://freight.cargo.site/w/1000/i/e718ecdd0bd1d89c4df62cf7a88b4462c7b3a1a0359d1b40247a9aac7a156670/IA-datapulse.png" />Color &amp; Style Exploration -&nbsp; I researched leading AI and ad-buy companies to identify the ideal primary color that aligns with industry standards and brand identity. I then adapted the color scale to the UI and performed thorough testing to ensure consistency, accessibility, and visual impact. <img width="4142" height="2302" width_o="4142" height_o="2302" data-src="https://freight.cargo.site/t/original/i/4300d985535477889a751d818a011ff4a4dc52a7e14ac6243771c01e9e08fefd/UI-style-exploration.png" data-mid="243784190" border="0" src="https://freight.cargo.site/w/1000/i/4300d985535477889a751d818a011ff4a4dc52a7e14ac6243771c01e9e08fefd/UI-style-exploration.png" /> <img width="2196" height="1264" width_o="2196" height_o="1264" data-src="https://freight.cargo.site/t/original/i/7a08f34f996f055533bb85d4dbb7782508ab80728dabeea6c7a898198784e9fa/UI-style-exploration.png" data-mid="243783930" border="0" src="https://freight.cargo.site/w/1000/i/7a08f34f996f055533bb85d4dbb7782508ab80728dabeea6c7a898198784e9fa/UI-style-exploration.png" /> UI&amp;UX design -&nbsp;A. Screen Flow Design- Adwave - I designed the desktop versions of AdWave, creating a seamless experience for onboarding, product creation, campaign management, creating audience segments, and analysis. The design prioritizes clarity, usability, and an intuitive workflow to enhance the client experience. <img width="10360" height="5488" width_o="10360" height_o="5488" data-src="https://freight.cargo.site/t/original/i/9f81ce3112c0887a7f5a7364cbfb4c15aa008796126db734a33a8e24ed9e4046/AW-overview.png" data-mid="243790321" border="0" src="https://freight.cargo.site/w/1000/i/9f81ce3112c0887a7f5a7364cbfb4c15aa008796126db734a33a8e24ed9e4046/AW-overview.png" /> <img width="24738" height="6502" width_o="24738" height_o="6502" data-src="https://freight.cargo.site/t/original/i/da88abfc5d95ee0317661d93068d5f33a834defa9aa0c239a0717028f997c153/Sign-up.png" data-mid="243786763" border="0" src="https://freight.cargo.site/w/1000/i/da88abfc5d95ee0317661d93068d5f33a834defa9aa0c239a0717028f997c153/Sign-up.png" /><img width="26920" height="5522" width_o="26920" height_o="5522" data-src="https://freight.cargo.site/t/original/i/34e89e893a8070b0aa2cac3174430a9a3092438d435cee70ace4db6a44bb7370/Product.png" data-mid="243786762" border="0" src="https://freight.cargo.site/w/1000/i/34e89e893a8070b0aa2cac3174430a9a3092438d435cee70ace4db6a44bb7370/Product.png" /> <img width="10206" height="6655" width_o="10206" height_o="6655" data-src="https://freight.cargo.site/t/original/i/871b36a34b1f35303d7b80c1afcc43dc7d97a6059ff9931363a73adcb9f66ff5/create-camapaign.png" data-mid="243786843" border="0" src="https://freight.cargo.site/w/1000/i/871b36a34b1f35303d7b80c1afcc43dc7d97a6059ff9931363a73adcb9f66ff5/create-camapaign.png" />💡 AI in create campaign flow <img width="2273" height="1528" width_o="2273" height_o="1528" data-src="https://freight.cargo.site/t/original/i/20101547691e0a05976af5adc56e4479186885f9c9219bb0e559f4b0c23c7034/ai-opportunity1.png" data-mid="243787130" border="0" data-scale="100" src="https://freight.cargo.site/w/1000/i/20101547691e0a05976af5adc56e4479186885f9c9219bb0e559f4b0c23c7034/ai-opportunity1.png" /> Audience TargetingImplemented dynamic audience targeting by leveraging real-time data and predictive algorithms, enabling precise and personalized campaign strategies that adapt to user behavior and preferences. Create campaignLeveraging target events to set up campaigns simplifies the process, significantly reducing both time and complexity for users."<img width="1628" height="1104" width_o="1628" height_o="1104" data-src="https://freight.cargo.site/t/original/i/46dd8d921fb3f095d27c36646730c635dc949077fe79ecbfedca875d4c0c9b00/dropdown.png" data-mid="243787139" border="0" src="https://freight.cargo.site/w/1000/i/46dd8d921fb3f095d27c36646730c635dc949077fe79ecbfedca875d4c0c9b00/dropdown.png" /> <img width="2264" height="1528" width_o="2264" height_o="1528" data-src="https://freight.cargo.site/t/original/i/c4c2af81db991e4994889cd2270e18f732a4a5f84020004029b4fb0db8bcf640/ai-opportunity2.png" data-mid="243787135" border="0" src="https://freight.cargo.site/w/1000/i/c4c2af81db991e4994889cd2270e18f732a4a5f84020004029b4fb0db8bcf640/ai-opportunity2.png" /> <img width="2269" height="1528" width_o="2269" height_o="1528" data-src="https://freight.cargo.site/t/original/i/fc752ed9ee0d1a0262ebaa33cccd52c77d9e5dbd5c9ecab04ecc91b30a3dffb1/ai-opportunity3.png" data-mid="243787140" border="0" src="https://freight.cargo.site/w/1000/i/fc752ed9ee0d1a0262ebaa33cccd52c77d9e5dbd5c9ecab04ecc91b30a3dffb1/ai-opportunity3.png" /> Set bid &amp; budget Deliver actionable recommendations to optimize bid and budget settings, empowering users to make data-driven decisions with ease. DataPulse - I have also designed the desktop versions of DataPulse, delivering a seamless experience for overview analysis, real-time insights, reporting, and user exploration. The design prioritizes data visualization, ensuring clarity, accessibility, and actionable insights for users.<img width="5180" height="3964" width_o="5180" height_o="3964" data-src="https://freight.cargo.site/t/original/i/930ed483895e7f85a81e9724c6576d242c96c19f53759ca38af1472ae3d8d8f3/DP-overview.png" data-mid="243790290" border="0" src="https://freight.cargo.site/w/1000/i/930ed483895e7f85a81e9724c6576d242c96c19f53759ca38af1472ae3d8d8f3/DP-overview.png" /> 💡 AI in Data <img width="1170" height="582" width_o="1170" height_o="582" data-src="https://freight.cargo.site/t/original/i/4fa6a30bb507f83cc378f35a82c913beb55637af3e65280505b1c78768e5fd0c/ai-forecast-DP.png" data-mid="243859551" border="0" src="https://freight.cargo.site/w/1000/i/4fa6a30bb507f83cc378f35a82c913beb55637af3e65280505b1c78768e5fd0c/ai-forecast-DP.png" /> <img width="1170" height="582" width_o="1170" height_o="582" data-src="https://freight.cargo.site/t/original/i/1df8fd584d228f962901f4af88412fa1aeae9541fa1d0366de7c6678a76efb60/ai-forecast-DP2.png" data-mid="243859550" border="0" src="https://freight.cargo.site/w/1000/i/1df8fd584d228f962901f4af88412fa1aeae9541fa1d0366de7c6678a76efb60/ai-forecast-DP2.png" /> Predictive Insights and Trend ForecastingIncorporating AI into UX design allows for the seamless integration of predictive insights and trend forecasting, enhancing user decision-making and platform engagement. I utilized AI-powered predictive insights and trend forecasts to design performance trend visualizations that provide users with actionable data. By delivering weekly forecasts and insights, users are empowered to make informed decisions, optimize their campaigns, and plan strategically for future performance. These insights not only improve the user experience but also encourage users to create new campaigns, fostering recurring income for the platform while driving long-term value for both the users and the business. Design Tokens Design - I developed small, reusable design elements that form the foundation of a cohesive design system, streamlining the visual style and ensuring consistency across platforms. <img width="2648" height="1262" width_o="2648" height_o="1262" data-src="https://freight.cargo.site/t/original/i/31a7ba9ed28ee5b94d7397155ce7f2a16cb445600307a4f748caddb058c7b7f6/UIelement.png" data-mid="244012076" border="0" src="https://freight.cargo.site/w/1000/i/31a7ba9ed28ee5b94d7397155ce7f2a16cb445600307a4f748caddb058c7b7f6/UIelement.png" /> <img width="2368" height="1188" width_o="2368" height_o="1188" data-src="https://freight.cargo.site/t/original/i/362fa43d6be3f21d6b05cf20b2521a4c6c08b3bbcb05e4e8a774eaeaa58d2a9a/Screenshot-2026-01-23-at-11.25.44AM.png" data-mid="243855856" border="0" src="https://freight.cargo.site/w/1000/i/362fa43d6be3f21d6b05cf20b2521a4c6c08b3bbcb05e4e8a774eaeaa58d2a9a/Screenshot-2026-01-23-at-11.25.44AM.png" /> ︎4px grid system in practical consideration -&nbsp; Strict structure vs. Practical flexibility&lt;Font size setting&gt; When setting up design tokens for spacing and font sizes, I adjusted the smaller font sizes from the standard 8, 12, 16, 20, 24, 32, 40, etc. to 10, 12, 14, 20, 24, 32 to better suit a data-heavy platform. Although this approach deviates from a strict 4px grid system, it improves usability for smaller text elements in tables, charts, and forms, ensuring better readability and functionality in dense data environments. <img width="616" height="262" width_o="616" height_o="262" data-src="https://freight.cargo.site/t/original/i/26b940672aa92a5ed8c1155d82a4a3a14f0d5ff47f18ab501811c9b7cef8770e/button.png" data-mid="244010523" border="0" src="https://freight.cargo.site/w/616/i/26b940672aa92a5ed8c1155d82a4a3a14f0d5ff47f18ab501811c9b7cef8770e/button.png" /><img width="676" height="246" width_o="676" height_o="246" data-src="https://freight.cargo.site/t/original/i/828840023279fb66cc09dba238a44dc8db25ee401e8d03b13f19be2c2efe34b9/statustag.png" data-mid="244010522" border="0" src="https://freight.cargo.site/w/676/i/828840023279fb66cc09dba238a44dc8db25ee401e8d03b13f19be2c2efe34b9/statustag.png" /> &lt;Padding &amp; spacing in UI elements&gt; When it comes to padding within elements, spacing strictly follows the 4px grid. However, different approaches are applied to the spacing between icons and text, depending on the purpose: Button text-icon padding: A 2px spacing is used to create a more compact look, supporting the text without taking up excessive space. Status tag text-icon padding: A 4px spacing is used to make the icon more prominent and visually distinct, aligning with its purpose as an indicator within tables. Componenet Design -&nbsp;I designed Date Picker, Table Filter, Log List, and Table &amp; Chart are design user-friendly, data-driven, and functional interfaces. ︎Date Picker A Date Picker is an essential tool for reporting and analytics, enabling users to select specific timeframes with ease. By offering features like range selection and preset options, it ensures accurate insights while minimizing user errors. <img width="1352" height="339" width_o="1352" height_o="339" data-src="https://freight.cargo.site/t/original/i/f5fbabad634f2f55e06827811c22a18ac205f58a9acfed8905267e80e0047162/Datepicker.png" data-mid="243859135" border="0" src="https://freight.cargo.site/w/1000/i/f5fbabad634f2f55e06827811c22a18ac205f58a9acfed8905267e80e0047162/Datepicker.png" /> <img width="1632" height="363" width_o="1632" height_o="363" data-src="https://freight.cargo.site/t/original/i/b5aba2c8bdfb2def16ff4b48ce94f32774b11acfca5b94509c27afff20af3135/Datepicker2.png" data-mid="243954401" border="0" src="https://freight.cargo.site/w/1000/i/b5aba2c8bdfb2def16ff4b48ce94f32774b11acfca5b94509c27afff20af3135/Datepicker2.png" /> <img width="1138" height="301" width_o="1138" height_o="301" data-src="https://freight.cargo.site/t/original/i/c7166bda8bf3be7015b02453a81f5e7be79dcd1433e7dc827bb6ad25bc113114/tablefilter_1.png" data-mid="243859375" border="0" src="https://freight.cargo.site/w/1000/i/c7166bda8bf3be7015b02453a81f5e7be79dcd1433e7dc827bb6ad25bc113114/tablefilter_1.png" /><img width="1206" height="230" width_o="1206" height_o="230" data-src="https://freight.cargo.site/t/original/i/832f02f66b36e63cd2fd5941514c4c26ecf2b544d1784566069f8ad921037bec/tablefilter_2.png" data-mid="243859374" border="0" src="https://freight.cargo.site/w/1000/i/832f02f66b36e63cd2fd5941514c4c26ecf2b544d1784566069f8ad921037bec/tablefilter_2.png" /> <img width="1138" height="236" width_o="1138" height_o="236" data-src="https://freight.cargo.site/t/original/i/0845c93efd4299764d55a974dcb7cebd959d3dbce5b53f8c8bf257423e05ffa9/tablefilter_3.png" data-mid="243859407" border="0" src="https://freight.cargo.site/w/1000/i/0845c93efd4299764d55a974dcb7cebd959d3dbce5b53f8c8bf257423e05ffa9/tablefilter_3.png" /> ︎Table Filter Table Filter enables users to sort and refine data, making it easier to locate specific information efficiently. With features like multi-criteria filtering, search-as-you-type functionality, and the option to save filter presets, it simplifies complex datasets and boosts user productivity. ︎Log list Effective log design allows users to quickly scan, search, and interpret information, even within dense or real-time data streams. A well-designed log is responsive and optimized for visibility across different screen sizes, ensuring a seamless user experience. <img width="1138" height="1492" width_o="1138" height_o="1492" data-src="https://freight.cargo.site/t/original/i/54d6040f169ef1183cf5a6e6ee5d6eb06b98c310171a448d3cd460ea8585e69a/loglist.png" data-mid="243859456" border="0" src="https://freight.cargo.site/w/1000/i/54d6040f169ef1183cf5a6e6ee5d6eb06b98c310171a448d3cd460ea8585e69a/loglist.png" /> ︎Table &amp; Chart Balancing functionality, aesthetics, and efficiency in data visualization, allowing users to seamlessly switch between detailed data (tables) and high-level trends (charts). Interactions like hover, tooltips, or clicks partially reveal data, enhancing users' understanding. <img width="1090" height="450" width_o="1090" height_o="450" data-src="https://freight.cargo.site/t/original/i/49b95b099694e5c68012797fb714b2258439dca326e9c00bd30cb54e36634280/chart1.png" data-mid="243860059" border="0" src="https://freight.cargo.site/w/1000/i/49b95b099694e5c68012797fb714b2258439dca326e9c00bd30cb54e36634280/chart1.png" /> <img width="1170" height="454" width_o="1170" height_o="454" data-src="https://freight.cargo.site/t/original/i/7fb116ee1964b9b9e37a76c459c77493373d1167ecdaa13c63f054e323d4d804/barchart.png" data-mid="243860060" border="0" src="https://freight.cargo.site/w/1000/i/7fb116ee1964b9b9e37a76c459c77493373d1167ecdaa13c63f054e323d4d804/barchart.png" /><img width="1171" height="641" width_o="1171" height_o="641" data-src="https://freight.cargo.site/t/original/i/55e3ffd0f85a2f331844e6a7e32a2dd894a2beb95c6e74a7aa9ddd2322ac6b5a/Cohort.png" data-mid="243859910" border="0" src="https://freight.cargo.site/w/1000/i/55e3ffd0f85a2f331844e6a7e32a2dd894a2beb95c6e74a7aa9ddd2322ac6b5a/Cohort.png" /><img width="1122" height="446" width_o="1122" height_o="446" data-src="https://freight.cargo.site/t/original/i/c073b9699cbba45096fed800a8d691baec6636ff1141396a4e0a04924a546c56/funnelchart.png" data-mid="243859929" border="0" src="https://freight.cargo.site/w/1000/i/c073b9699cbba45096fed800a8d691baec6636ff1141396a4e0a04924a546c56/funnelchart.png" /> <img width="1090" height="509" width_o="1090" height_o="509" data-src="https://freight.cargo.site/t/original/i/6cf08c74e7f5ca35c8f3f042d0e81501e4f77a8a556436128cd9bf6b42a20670/chart2.png" data-mid="243859935" border="0" src="https://freight.cargo.site/w/1000/i/6cf08c74e7f5ca35c8f3f042d0e81501e4f77a8a556436128cd9bf6b42a20670/chart2.png" /><img width="1058" height="296" width_o="1058" height_o="296" data-src="https://freight.cargo.site/t/original/i/423c6a1971874a7ff04e887546c5f67044bc0432275d71f3c705b1589200c1c5/piechart.png" data-mid="243859896" border="0" src="https://freight.cargo.site/w/1000/i/423c6a1971874a7ff04e887546c5f67044bc0432275d71f3c705b1589200c1c5/piechart.png" /><img width="1139" height="329" width_o="1139" height_o="329" data-src="https://freight.cargo.site/t/original/i/5faf16de95db7663a47bcb1036f9fcdc6bc71363de81b6a0e6863ffee7d309e8/table.png" data-mid="243859914" border="0" src="https://freight.cargo.site/w/1000/i/5faf16de95db7663a47bcb1036f9fcdc6bc71363de81b6a0e6863ffee7d309e8/table.png" /><img width="1123" height="599" width_o="1123" height_o="599" data-src="https://freight.cargo.site/t/original/i/ac4cf12bbc917b9681dccb5710d00bab4212616012caadd0537243b7f9489238/geochart.png" data-mid="243859917" border="0" src="https://freight.cargo.site/w/1000/i/ac4cf12bbc917b9681dccb5710d00bab4212616012caadd0537243b7f9489238/geochart.png" /> Launched: Feb 2026 https://slwong.cargo.site/Nodepay Mon, 26 Jan 2026 07:30:26 +0000 slwong https://slwong.cargo.site/Nodepay <img width="2354" height="2188" width_o="2354" height_o="2188" data-src="https://freight.cargo.site/t/original/i/e81230a48f85848dc829296b2de4581764284a3ef931f879f2a9f80c43dbc73b/nodepay_app2.png" data-mid="243956510" border="0" src="https://freight.cargo.site/w/1000/i/e81230a48f85848dc829296b2de4581764284a3ef931f879f2a9f80c43dbc73b/nodepay_app2.png" /> Nodepay AI-Driven Insight Platform - UI/UX The proposal I designed a beta version of an AI-driven insight platform that fosters high community engagement by integrating actionable insights, intuitive workflows, and seamless user interaction. My Role Lead UI/UX Designer -&nbsp;UX research, UX flow design, User interface design, Business/ Tech requirement validation Timeline3 months Tools Figma, Figjam Imapct&nbsp; Beta launched in December 2025; official launch in February 2026.Achieved: Daily Active Users: &gt;14K Paid Users: &gt;1K Monthly Active Users: &gt;110KThis demonstrates strong early adoption and engagement, reflecting the platform's value and user-driven appeal. Challenge: &nbsp; "How might we create an AI-driven platform that delivers valuable insights while fostering active community engagement and collaboration, incorporating data from markets, social channels, and pro users in the Web3 community?" Project Brief I redesigned the platform's IA, navigation, and user flows to enhance storytelling, streamline payment and onboarding processes, and boost user engagement and retention. Discovery phase -&nbsp;1. IA audtion and redesign To ensure smooth site navigation, I designed an IA tailored to the users' personas. Step1 (OG IA): I consolidated the handover screens from the previous designer, where the IA lacked structure and consistency. <img width="6368" height="1792" width_o="6368" height_o="1792" data-src="https://freight.cargo.site/t/original/i/cb1b65dd7b4bda9ea361799dbcbbdd6e4ec1ee7f37474f47940f070228309013/OGIA.png" data-mid="243957676" border="0" src="https://freight.cargo.site/w/1000/i/cb1b65dd7b4bda9ea361799dbcbbdd6e4ec1ee7f37474f47940f070228309013/OGIA.png" /> Step 2 (PRD IA): I analyzed and validated the PRD, mapping the IA with actionable insights and key questions to align with user needs. &nbsp; <img width="32768" height="10970" width_o="32768" height_o="10970" data-src="https://freight.cargo.site/t/original/i/be63796be04c97baf07f1fdd3fb32be98defb2c654a686bbe37e9787e2646d54/PRD-IA.png" data-mid="243957698" border="0" src="https://freight.cargo.site/w/1000/i/be63796be04c97baf07f1fdd3fb32be98defb2c654a686bbe37e9787e2646d54/PRD-IA.png" /> Step 3 (NEW IA):&nbsp;I finalized a version of the IA with three levels, featuring clear grouping of user actions: Get Insight, Explore &amp; Engage, and Control for a streamlined and intuitive user experience. <img width="3386" height="950" width_o="3386" height_o="950" data-src="https://freight.cargo.site/t/original/i/be0795c0a8ffa8038bec80e7febefb71d3ff6c17849e8fdf21272b9bdd795add/NewIA-2.png" data-mid="243957715" border="0" src="https://freight.cargo.site/w/1000/i/be0795c0a8ffa8038bec80e7febefb71d3ff6c17849e8fdf21272b9bdd795add/NewIA-2.png" /> Discovery phase - 2. Presona The primary user group for this newly built platform consists of loyal users from v1, which helps prioritize functions aligned with their goals. Engagement features, such as daily contributions and actions like creating, answering, and voting, become crucial. Additionally, streamlining the onboarding and payment flows is a top priority to enhance user experience. <img width="3398" height="1600" width_o="3398" height_o="1600" data-src="https://freight.cargo.site/t/original/i/da9396d7e8b9f3ed1c90d9fd9f1f741e1d3b93c0f4306c09ef8c0df2194a4d46/nodepay-presona.png" data-mid="243957723" border="0" src="https://freight.cargo.site/w/1000/i/da9396d7e8b9f3ed1c90d9fd9f1f741e1d3b93c0f4306c09ef8c0df2194a4d46/nodepay-presona.png" /> Discovery phase - 3. Navigation Design&nbsp;evolve with user feedback I redesigned the navigation bar based on the IA, organizing pages and actions into meaningful categories for users. &lt;OG version&gt; <img width="1514" height="984" width_o="1514" height_o="984" data-src="https://freight.cargo.site/t/original/i/a6494b4744e9754779b471e3318bf03864cbe0491f4915ac407bb811315b86c6/Old-version---nav-bar.png" data-mid="244011783" border="0" src="https://freight.cargo.site/w/1000/i/a6494b4744e9754779b471e3318bf03864cbe0491f4915ac407bb811315b86c6/Old-version---nav-bar.png" /> &lt;v1 version&gt; <img width="1442" height="1026" width_o="1442" height_o="1026" data-src="https://freight.cargo.site/t/original/i/500e9b974f7873f2b652694ce504fd3ff6c8cf8c93c38f407779bacec38b3171/nav-bar---v1.png" data-mid="244011781" border="0" src="https://freight.cargo.site/w/1000/i/500e9b974f7873f2b652694ce504fd3ff6c8cf8c93c38f407779bacec38b3171/nav-bar---v1.png" /> &nbsp; &nbsp; After launching the first version, I gathered feedback from senior community members and released a second version to improve clarity and usability. &nbsp; <img width="489" height="236" width_o="489" height_o="236" data-src="https://freight.cargo.site/t/original/i/b0434cb72c80a1c4d95284bf59e6b77dba425893366206a3f9bd733f7085bab3/userfeedback.png" data-mid="244012052" border="0" src="https://freight.cargo.site/w/489/i/b0434cb72c80a1c4d95284bf59e6b77dba425893366206a3f9bd733f7085bab3/userfeedback.png" /> &lt;v2 version&gt; <img width="1426" height="1026" width_o="1426" height_o="1026" data-src="https://freight.cargo.site/t/original/i/72bfd991bbbd5291203f4e44b8223fd0d5c05ed5a1dbcd177c583b2470250eff/nav-bar---v2-2.png" data-mid="244012104" border="0" src="https://freight.cargo.site/w/1000/i/72bfd991bbbd5291203f4e44b8223fd0d5c05ed5a1dbcd177c583b2470250eff/nav-bar---v2-2.png" /> Webapp - Navigation bar <img width="790" height="812" width_o="790" height_o="812" data-src="https://freight.cargo.site/t/original/i/11ac05720b5b7a38cb71a0e63f7ee8d868bf8e7f12e6569b164c9e9d0eb9ccd0/webapp-nav.png" data-mid="244012697" border="0" src="https://freight.cargo.site/w/790/i/11ac05720b5b7a38cb71a0e63f7ee8d868bf8e7f12e6569b164c9e9d0eb9ccd0/webapp-nav.png" /> App - Navigation bar <img width="826" height="852" width_o="826" height_o="852" data-src="https://freight.cargo.site/t/original/i/e61ad2dd2758171d8eeab1819fe7316d6fe2298c8d1551b7608143f95521626f/app-nav.png" data-mid="244012696" border="0" src="https://freight.cargo.site/w/826/i/e61ad2dd2758171d8eeab1819fe7316d6fe2298c8d1551b7608143f95521626f/app-nav.png" /> Design phase - How to Optimize This Flow for Retention? The platform was designed around the core flow: Onboarding → View Insights → Contribute → Subscribe → Repeat. Starting from user flows, I created a seamless experience that encourages users to engage continuously, fostering recurring interactions and long-term platform retention. <img width="3688" height="1864" width_o="3688" height_o="1864" data-src="https://freight.cargo.site/t/original/i/d3ae33915f8c6bd2c6dfa46223eca8ad08cc48adb674b1e4b5dea0cb0669fd12/Flow.png" data-mid="244066841" border="0" src="https://freight.cargo.site/w/1000/i/d3ae33915f8c6bd2c6dfa46223eca8ad08cc48adb674b1e4b5dea0cb0669fd12/Flow.png" /> ✅ A. Simplify Onboarding I designed a quick sign-up and sign-in process with social media authentication, offering users a fast and secure onboarding experience. To optimize the design workflow, I modularized reusable flows, such as setting up 2FA, payment, and other key processes, enhancing efficiency and streamlining collaboration for the team.&lt;Onboarding flow&gt; <img width="2700" height="446" width_o="2700" height_o="446" data-src="https://freight.cargo.site/t/original/i/da5d58b43ed5e2789c39cdf0101150a1e3299bfb3b5af596433d20909e93e4c8/Onboarding.png" data-mid="244067644" border="0" src="https://freight.cargo.site/w/1000/i/da5d58b43ed5e2789c39cdf0101150a1e3299bfb3b5af596433d20909e93e4c8/Onboarding.png" /> ✅ B. Show Immediate Value on homepage or search with Signals I designed a homepage showcasing market, social, and sentiment signals, delivering compelling insights immediately after onboarding to capture user interest and drive engagement. &lt;Homepage&gt; <img width="1424" height="1040" width_o="1424" height_o="1040" data-src="https://freight.cargo.site/t/original/i/24547fe123833aa1294875121811602c8ccfc7527d9cdf37709d26a55c92c054/Homepage1.png" data-mid="244067967" border="0" src="https://freight.cargo.site/w/1000/i/24547fe123833aa1294875121811602c8ccfc7527d9cdf37709d26a55c92c054/Homepage1.png" /> <img width="1424" height="1040" width_o="1424" height_o="1040" data-src="https://freight.cargo.site/t/original/i/fd7d98a3fe5d4341e87b707ebf0791ce11e2a525716fa28e4917d3ca37fe8fa9/Homepage1-1.png" data-mid="244067966" border="0" src="https://freight.cargo.site/w/1000/i/fd7d98a3fe5d4341e87b707ebf0791ce11e2a525716fa28e4917d3ca37fe8fa9/Homepage1-1.png" /> <img width="1424" height="1040" width_o="1424" height_o="1040" data-src="https://freight.cargo.site/t/original/i/720fa27f81ce6180b1b2b1aa52cb0d37b924518907a67bd5c414f339059ddbf3/Homepage1-2.png" data-mid="244068053" border="0" src="https://freight.cargo.site/w/1000/i/720fa27f81ce6180b1b2b1aa52cb0d37b924518907a67bd5c414f339059ddbf3/Homepage1-2.png" /> <img width="1424" height="1040" width_o="1424" height_o="1040" data-src="https://freight.cargo.site/t/original/i/032fdb40254568ba342d7b6857dddb4be3938221b3f34dee23ef1265021a45b6/Homepage1-3.png" data-mid="244068862" border="0" src="https://freight.cargo.site/w/1000/i/032fdb40254568ba342d7b6857dddb4be3938221b3f34dee23ef1265021a45b6/Homepage1-3.png" /> ✅ C. Reward Contributions: Offer incentives (e.g., recognition, badges, or tokenized rewards) to motivate users to contribute regularly. These incentives appear in both the personal profile and the public profile.&nbsp; &lt;Profile&gt; <img width="1440" height="1040" width_o="1440" height_o="1040" data-src="https://freight.cargo.site/t/original/i/9cf8eb5dee729c2219617b11b4ec8975f79468acabdc4011620be2fbc0a75de4/profile.png" data-mid="244123787" border="0" src="https://freight.cargo.site/w/1000/i/9cf8eb5dee729c2219617b11b4ec8975f79468acabdc4011620be2fbc0a75de4/profile.png" /> ✅ D. Subscription Benefits: Clearly communicate the value of subscribing (e.g., exclusive insights or features) to encourage conversions. &lt; Subscription flow chart&gt; Given that the subscription flow involved multiple screens and interconnected processes, I created a detailed flow chart to facilitate seamless team collaboration and alignment.<img width="5472" height="3456" width_o="5472" height_o="3456" data-src="https://freight.cargo.site/t/original/i/a1df43cc66e4b8a809c9c6c7f22d5c36cafec7f91af83df5a94ee4fd5ee062a3/Subscribtion-Flow.png" data-mid="244071533" border="0" src="https://freight.cargo.site/w/1000/i/a1df43cc66e4b8a809c9c6c7f22d5c36cafec7f91af83df5a94ee4fd5ee062a3/Subscribtion-Flow.png" /> &lt;Payment flow&gt; I designed a modular, reusable payment flow that accounts for both successful (happy) and error-handling (unhappy) scenarios, including some interaction design for dropdown component, ensuring a seamless and robust user experience. <img width="2775" height="1415" width_o="2775" height_o="1415" data-src="https://freight.cargo.site/t/original/i/74a4c58590b70cbb6a7d9095824127c1ad55da1af820f816c4b2950c8219b86a/Webapp-payment.png" data-mid="244071707" border="0" src="https://freight.cargo.site/w/1000/i/74a4c58590b70cbb6a7d9095824127c1ad55da1af820f816c4b2950c8219b86a/Webapp-payment.png" /> <img width="1262" height="1692" width_o="1262" height_o="1692" data-src="https://freight.cargo.site/t/original/i/f38c04b43f51f223c32b534efffa00d2308da8fe9c72fccc7495faceb858796f/Payment.png" data-mid="244071600" border="0" src="https://freight.cargo.site/w/1000/i/f38c04b43f51f223c32b534efffa00d2308da8fe9c72fccc7495faceb858796f/Payment.png" /> E. Repeat: Gamify Repetition: Add gamified elements like progress trackers or streaks to make the cycle feel rewarding and enjoyable. <img width="1440" height="1024" width_o="1440" height_o="1024" data-src="https://freight.cargo.site/t/original/i/4c6e6dbb85a94862086598194cb03c3b336ee5c9f8dbab0003cec1fd478bb430/contribute4.png" data-mid="244122100" border="0" src="https://freight.cargo.site/w/1000/i/4c6e6dbb85a94862086598194cb03c3b336ee5c9f8dbab0003cec1fd478bb430/contribute4.png" /> How AI enhances Insights and brings Value to Users?&nbsp; ︎1. Turning Complexity into Clarity Simplified complex data by curating the most relevant and popular signals from social media, news, and market trends, distilling thousands of data points into actionable insights. <img width="6400" height="4800" width_o="6400" height_o="4800" data-src="https://freight.cargo.site/t/original/i/a218aa19dad70fc51f72c4d243df79f1b258605304322d58ccd9aff4d9df4647/allsignal.jpeg" data-mid="244071408" border="0" src="https://freight.cargo.site/w/1000/i/a218aa19dad70fc51f72c4d243df79f1b258605304322d58ccd9aff4d9df4647/allsignal.jpeg" /> <img width="1424" height="1040" width_o="1424" height_o="1040" data-src="https://freight.cargo.site/t/original/i/46a738ae23936a8cff5ac56de0041ab42fc1fcdca71a9ca8a193df0e9f7588ea/library.png" data-mid="244071389" border="0" src="https://freight.cargo.site/w/1000/i/46a738ae23936a8cff5ac56de0041ab42fc1fcdca71a9ca8a193df0e9f7588ea/library.png" /> ︎2. Personalized Insights with AI-Driven Summaries for Enhanced Engagement Personalize Insights by putting personal Signals to library. And provides AI summary increasing relevance and engagement. ︎3. AI-Powered Assistance for Crafting Valuable Sentiments I developed an AI-driven agent that helps users refine their questions and answer choices, providing scoring as a reference to ensure their created sentiment is meaningful and impactful for both themselves and their audience. This innovation enhances user engagement and fosters more valuable interactions. <img width="5120" height="3114" width_o="5120" height_o="3114" data-src="https://freight.cargo.site/t/original/i/a7bf80021a2f5216fa42afdb23ca7404bece6055f50617b567e60eaddc50a402/AI-Powered-Assistance.png" data-mid="244122062" border="0" src="https://freight.cargo.site/w/1000/i/a7bf80021a2f5216fa42afdb23ca7404bece6055f50617b567e60eaddc50a402/AI-Powered-Assistance.png" /> https://slwong.cargo.site/DBS-PB Mon, 27 Mar 2023 07:26:01 +0000 slwong https://slwong.cargo.site/DBS-PB DBS Private Banking Digital Benchmarking How we provide a scalable benchmarking framework and methodology to compare competitor capabilities, designs and processes The proposal Sector Private Bank Challenge The bank needs to benchmark its offering from a UX perspective to face the industry's digital transformation challenge, differentiate its products from the market, and create new business opportunities. My Role Workshop Facilitation, Heuristic Evaluations <img width="1968" height="1499" width_o="1968" height_o="1499" data-src="https://freight.cargo.site/t/original/i/97899dfb371650b2f07312c0450f690700c7d33ed3c6824cb5264fc866265deb/report.png" data-mid="173188641" border="0" src="https://freight.cargo.site/w/1000/i/97899dfb371650b2f07312c0450f690700c7d33ed3c6824cb5264fc866265deb/report.png" /> Workshop Facilitation Workshop #1 In a two hours workshop, we decided top focus on the benchmarking framework from key dimensions in the private bank industry. We made quick decision, to get commitment among stakeholders on focused topics and to be able to act strategically despite time. <img width="1770" height="1499" width_o="1770" height_o="1499" data-src="https://freight.cargo.site/t/original/i/66f4be4c4578c7ebae4c3c484b3a4b7885d0af6038e7b8967e55691bfa85526c/workshopA.jpg" data-mid="173189900" border="0" src="https://freight.cargo.site/w/1000/i/66f4be4c4578c7ebae4c3c484b3a4b7885d0af6038e7b8967e55691bfa85526c/workshopA.jpg" /> Collabration tool: Miro&nbsp; Benchmarking key dimensions By reviewing the existing key dimensions, we brainstormed additional focused dimensions and priorities them in just 15 minutes.Risk rebalancing adviceHealth check portfolioCustomer education/ comfort on productsAcquisition journey Essential insights/ highlights for each functions To understand each lever’s insights, highlights, and functions, we ran 9 tasks to brainstorm in-depth ideas with stakeholders, aligning focused areas to make sure the framework setting meets client expectation Workshop outcomeBenchmarking framework in Primary Deep Dive Area/ Secondary Research Areas/ Tertiary Research Workshop #2 In a one-hour workshop, we aligned the top 3 journeys for benchmarking UX journey. We extracted extra insights from the existing client platform and put them in the benchmarking framework <img width="1770" height="1026" width_o="1770" height_o="1026" data-src="https://freight.cargo.site/t/original/i/59ec5aa9f74f9c939ae20833b4d3ba625fb22d104e8697d562e74b14ecf87765/workshopB.jpg" data-mid="173192558" border="0" src="https://freight.cargo.site/w/1000/i/59ec5aa9f74f9c939ae20833b4d3ba625fb22d104e8697d562e74b14ecf87765/workshopB.jpg" /> Workshop outcome Detailed customer journey screen flow for audition UX Audit: Conduct Heuristic EvaluationWe went through 7 private banks’ digital platforms and over 50 functions. We highlighted usability issues, unique functions, and offerings. We ranked the competitors' key dimensions with scores and provided recommendations to our client based on our findings. &nbsp;<img width="2000" height="650" width_o="2000" height_o="650" data-src="https://freight.cargo.site/t/original/i/4407990a5b01040cfb8052b010aa91ef3945008f0e55b50f043a5a1737d12de8/aduit-component.png" data-mid="173195725" border="0" src="https://freight.cargo.site/w/1000/i/4407990a5b01040cfb8052b010aa91ef3945008f0e55b50f043a5a1737d12de8/aduit-component.png" /> <img width="3196" height="986" width_o="3196" height_o="986" data-src="https://freight.cargo.site/t/original/i/7b578c647c6c9114a39f54d989e317cb055ab4713ffc665d322ded9da3fe840b/audit.png" data-mid="173196504" border="0" src="https://freight.cargo.site/w/1000/i/7b578c647c6c9114a39f54d989e317cb055ab4713ffc665d322ded9da3fe840b/audit.png" /> https://slwong.cargo.site/MOVE Thu, 07 Jan 2021 11:54:52 +0000 slwong https://slwong.cargo.site/MOVE Manulife - MOVESport app - uiux <img width="230" height="83" width_o="230" height_o="83" data-src="https://freight.cargo.site/t/original/i/2a22559aaa807f05f635443450b6cc215d46b2a90115ef5a01ea7877834cd4e7/logo.png" data-mid="94260942" border="0" src="https://freight.cargo.site/w/230/i/2a22559aaa807f05f635443450b6cc215d46b2a90115ef5a01ea7877834cd4e7/logo.png" /> Challenges of exsiting MOVE app&nbsp; ・ Less engagement from users ・ Hard to differentiate from others competitors Daily activity tracker  <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/372dc2ea3d9a6d014f02f6d66444758e6f02bb54af810b75763a5fe965f12592/move2.png" data-mid="94263949" border="0" src="https://freight.cargo.site/w/1000/i/372dc2ea3d9a6d014f02f6d66444758e6f02bb54af810b75763a5fe965f12592/move2.png" /> Group exercise challenge <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/481330f30454088008ecca1982f23bc122c242eec176f99e2c6040e57bd753b1/move3.png" data-mid="94264364" border="0" src="https://freight.cargo.site/w/1000/i/481330f30454088008ecca1982f23bc122c242eec176f99e2c6040e57bd753b1/move3.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/e3f6a82d6ece39a91a29c45de14753b7fe47b093dddc6412ddb7050985d228e6/move4.png" data-mid="94264565" border="0" src="https://freight.cargo.site/w/1000/i/e3f6a82d6ece39a91a29c45de14753b7fe47b093dddc6412ddb7050985d228e6/move4.png" />MOVE club <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/885cec9edf861d168a01425fc9189043e006f8eb82bdeba3b0fa81c8e97674a9/move5.png" data-mid="94264764" border="0" src="https://freight.cargo.site/w/1000/i/885cec9edf861d168a01425fc9189043e006f8eb82bdeba3b0fa81c8e97674a9/move5.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/f41ce10be8c08c3c1abfa1d7ea3b95cecbb92099389dcf9b71fa23bbea7fdfa7/move6.png" data-mid="94264768" border="0" src="https://freight.cargo.site/w/1000/i/f41ce10be8c08c3c1abfa1d7ea3b95cecbb92099389dcf9b71fa23bbea7fdfa7/move6.png" /> https://slwong.cargo.site/WorkSourceWA Thu, 14 Aug 2025 02:52:57 +0000 slwong https://slwong.cargo.site/WorkSourceWA <img width="2100" height="2100" width_o="2100" height_o="2100" data-src="https://freight.cargo.site/t/original/i/d5d15f29becd4adb64c1ca71e75bfc9f088bec09239491d35976cc213c64b0f0/ESD-Thumbnail.png" data-mid="237019475" border="0" src="https://freight.cargo.site/w/1000/i/d5d15f29becd4adb64c1ca71e75bfc9f088bec09239491d35976cc213c64b0f0/ESD-Thumbnail.png" />WorkSourceWA Jobseekers &amp; employers experience design - UX Client: Washington State Employment Security Department The Proposal As part of Washington State’s initiative to modernize the Employment Security Department’s digital services, I led UX and content strategy efforts to enhance the experience for both job seekers&nbsp;and employers.&nbsp;My focus included enhancing website navigation, refining the information architecture, and developing clear, accessible UX writing aligned with user needs. Collaborating closely with cross-functional teams, I helped shape a unified content strategy that simplified complex information and improved user satisfaction across the platform. Goal&nbsp; Improve the end-to-end desktop and mobile experience of WorkSourceWA through UX improvements and a scalable content strategy. Role Lead content strategist and UX designer Tools Figma, Optimal Workshop (Tree testing, card sorting) Timeline 10 weeks <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/a06eca0f8acc102070745f019f3744298d6ecb8e539aacefbd91acadaa09ca72/ESD-mockup.png" data-mid="237018640" border="0" src="https://freight.cargo.site/w/1000/i/a06eca0f8acc102070745f019f3744298d6ecb8e539aacefbd91acadaa09ca72/ESD-mockup.png" /> Challenge: &nbsp; How might we enhance the WorkSourceWA desktop and mobile experience—both in terms of UX and content strategy—to better serve the needs of job seekers and employers? Approach &amp; ProcessWeek 1–2: Discovery &amp; Research Deliverables: Content Strategy Report – audited existing content, identified redundancies, tone inconsistencies, and accessibility issues. Competitive Analysis – benchmarked digital platforms offering employment services to uncover UX and content opportunities. Leadership Highlight: Led research, strategy creation, and collaborated with content owners to align on goals Content Strategy Report What is the process of enhancing Content Strategy?&nbsp; 1. Define objectives - Driving content strategy enhancements that support and align with the Six Strategic Goals of WIOA (Workforce Innovation and Opportunity Act).<img width="1959" height="918" width_o="1959" height_o="918" data-src="https://freight.cargo.site/t/original/i/df8f0e79e5529293f87c7f0b6d899a75c2b20578803702630746124334f03ed0/ESD-cs1.png" data-mid="237019105" border="0" src="https://freight.cargo.site/w/1000/i/df8f0e79e5529293f87c7f0b6d899a75c2b20578803702630746124334f03ed0/ESD-cs1.png" /> 2. Audience Analysis - To align the team around user needs, I consolidated input from 3 key user groups—jobseekers, employers, and staff—into five actionable personas that informed both content strategy and UX design. <img width="818" height="574" width_o="818" height_o="574" data-src="https://freight.cargo.site/t/original/i/b42043e1fae10f79893179f2e724a63f0980941dbe7b1de7169400d4f4013643/Target-Audience---Job-Seeker.png" data-mid="237020478" border="0" src="https://freight.cargo.site/w/818/i/b42043e1fae10f79893179f2e724a63f0980941dbe7b1de7169400d4f4013643/Target-Audience---Job-Seeker.png" /> <img width="3712" height="2848" width_o="3712" height_o="2848" data-src="https://freight.cargo.site/t/original/i/0891030be1b0cffccae08ecde7122f3d66759a21daf6e3c74fab600ca3c1c11f/Ethan-Miller-Persona.png" data-mid="237020707" border="0" src="https://freight.cargo.site/w/1000/i/0891030be1b0cffccae08ecde7122f3d66759a21daf6e3c74fab600ca3c1c11f/Ethan-Miller-Persona.png" /> <img width="3712" height="2704" width_o="3712" height_o="2704" data-src="https://freight.cargo.site/t/original/i/aaebee233e85eeb360705c2f47a78301478ed9266e92adb1a64650eb917f58d4/Maria-Johnson-Persona.png" data-mid="237020708" border="0" src="https://freight.cargo.site/w/1000/i/aaebee233e85eeb360705c2f47a78301478ed9266e92adb1a64650eb917f58d4/Maria-Johnson-Persona.png" /> <img width="3712" height="2378" width_o="3712" height_o="2378" data-src="https://freight.cargo.site/t/original/i/a8826fd84c4c59d394e1d630447c41d4d1e277dd1ba5c177b3efaa44ad92ccf1/Sara-Persona.png" data-mid="237020728" border="0" src="https://freight.cargo.site/w/1000/i/a8826fd84c4c59d394e1d630447c41d4d1e277dd1ba5c177b3efaa44ad92ccf1/Sara-Persona.png" /> <img width="3712" height="2260" width_o="3712" height_o="2260" data-src="https://freight.cargo.site/t/original/i/de4ab01839a7e72f86038d6019d3cfee6746d1ad095ebcace6fa915bfc24be9f/Mary-Persona.png" data-mid="237020794" border="0" src="https://freight.cargo.site/w/1000/i/de4ab01839a7e72f86038d6019d3cfee6746d1ad095ebcace6fa915bfc24be9f/Mary-Persona.png" /> <img width="3712" height="2354" width_o="3712" height_o="2354" data-src="https://freight.cargo.site/t/original/i/fdc4fc95aec739768f5fa487737ff91ae9b7d5fa332c238ef9f6f0257dd274db/James-Persona.png" data-mid="237020799" border="0" src="https://freight.cargo.site/w/1000/i/fdc4fc95aec739768f5fa487737ff91ae9b7d5fa332c238ef9f6f0257dd274db/James-Persona.png" /> 3. Key Themes and Topics&nbsp;- To build a successful content strategy for WorkSourceWA job seekers must balance addressing urgent needs—like resume help and job listings—with long-term support around career growth, training, and stability. <img width="2384" height="828" width_o="2384" height_o="828" data-src="https://freight.cargo.site/t/original/i/6ac0519257652b1b6e0eb0b88b91847e041c53b405cb2039c3f084bf9fee9be8/keytheme-jobseeker.png" data-mid="237021453" border="0" src="https://freight.cargo.site/w/1000/i/6ac0519257652b1b6e0eb0b88b91847e041c53b405cb2039c3f084bf9fee9be8/keytheme-jobseeker.png" /> <img width="2384" height="344" width_o="2384" height_o="344" data-src="https://freight.cargo.site/t/original/i/4c026ef0b93df03d2b9a83110e5de061e27171c7e8f01e17d8a624bc0d631ff5/keytheme-employer.png" data-mid="237021426" border="0" data-scale="100" src="https://freight.cargo.site/w/1000/i/4c026ef0b93df03d2b9a83110e5de061e27171c7e8f01e17d8a624bc0d631ff5/keytheme-employer.png" />4. Tone and Voice Guidelines&nbsp;- I developed a tone of voice for WorkSourceWA that is friendly, clear, and professional—designed to better connect with both jobseekers and employers. The language is conversational and supportive, helping users feel guided, motivated, and confident at every step of their journey. <img width="780" height="780" width_o="780" height_o="780" data-src="https://freight.cargo.site/t/original/i/ddf7eb5f545c156a11b6196624fe4a7f7fdaf391938b349993e4ef7721b1e8f3/ESD-Tone-and-Voice.png" data-mid="237053287" border="0" src="https://freight.cargo.site/w/780/i/ddf7eb5f545c156a11b6196624fe4a7f7fdaf391938b349993e4ef7721b1e8f3/ESD-Tone-and-Voice.png" /> Tone of Voice for Each Audience Tone and Voice by User Group body { font-family: Arial, sans-serif; padding: 1rem; margin: 0; background-color: #f9f9f9; } h2 { text-align: center; margin-bottom: 1rem; } table { width: 100%; border-collapse: collapse; background-color: #fff; } th, td { padding: 1rem; text-align: left; border: 1px solid #ddd; vertical-align: top; } th { background-color: #f0f0f0; } @media (max-width: 768px) { table, thead, tbody, th, td, tr { display: block; width: 100%; } thead { display: none; } tr { margin-bottom: 1.5rem; border: 1px solid #ccc; padding: 1rem; background-color: #fff; } td { display: flex; justify-content: space-between; padding: 0.5rem 0; } td::before { content: attr(data-label); font-weight: bold; flex-basis: 45%; } } User Group Tone Attributes Example Job Seekers with Immediate Needs(e.g., Maria’s Persona) Empathetic, Supportive, Action-Oriented “We know you’re juggling a lot right now. Let’s help you find the support you need, from job opportunities to financial assistance.” Recent Graduates and Career Changers(e.g., Ethan’s Persona) Encouraging, Motivational, Forward-Looking “Starting your career journey or taking it in a new direction? We’re here to guide you through every step.” Groups with Barriers to Employment Empowering, Inclusive, Reassuring “Whatever challenges you’re facing, we believe in your potential. Let us help you overcome those barriers and achieve your career goals.” Employers Professional, Solution-Oriented, Collaborative “Finding the right talent is critical for your business. Let us help you streamline the process with our personalized employer services.” 5. Content Creation Plan -&nbsp;I developed a streamlined content creation workflow for WorkSourceWA to ensure consistency, quality, and alignment with strategic goals. This internal process guides content from ideation to publishing and performance analysis—making it easier for teams to create user-focused content for jobseekers, employers, and other key audiences. <img width="1420" height="519" width_o="1420" height_o="519" data-src="https://freight.cargo.site/t/original/i/83b63edaf5327354f0a4b4fcef7ec290ab235f10ddac7e6b7061c115cb07ca88/Content-Creation-Plan.png" data-mid="237233943" border="0" src="https://freight.cargo.site/w/1000/i/83b63edaf5327354f0a4b4fcef7ec290ab235f10ddac7e6b7061c115cb07ca88/Content-Creation-Plan.png" /><img width="1130" height="774" width_o="1130" height_o="774" data-src="https://freight.cargo.site/t/original/i/115dfc5012421e14350b4591a986c57590d96e1ddad84fb5b357ce1becd10143/Example.png" data-mid="237236201" border="0" src="https://freight.cargo.site/w/1000/i/115dfc5012421e14350b4591a986c57590d96e1ddad84fb5b357ce1becd10143/Example.png" /> 6. Distribution Strategy - I developed a multi-channel content distribution strategy for WorkSourceWA to effectively reach both job seekers and employers. The website serves as the main content hub, supported by email newsletters, social media, video platforms, and virtual events. Promotional tactics include targeted social campaigns, SEM, email outreach, community partnerships, and referral programs. For employers, I focused on industry-specific content, webinars, local collaborations, and success stories. I also suggest&nbsp; SEO best practices to increase visibility and ensure content is discoverable by users actively seeking resources. 7. Measurement and KPIs -&nbsp; How we measure content strategy is successful? To measure the success of our content strategy, I defined clear metrics across audience segments. Core indicators include website traffic, user engagement, lead generation, and SEO performance. For employers, success is measured by the number of job postings viewed and overall satisfaction. For job seekers, we track job applications, content engagement, and satisfaction with the resources provided. These metrics ensure that content not only reaches the right audience but also drives meaningful action. Regular analysis helps refine the strategy, improve relevance, and demonstrate impact across both user groups Competitive AnalysisHow might we identify opportunities from competitors to strengthen WorkSourceWA’s position through competitive analysis? As Lead UX Researcher, I conducted a comprehensive competitive analysis of workforce development platforms to identify strategic opportunities for WorkSourceWA. The goal was to evaluate competitor services, user experiences, and engagement strategies to uncover strengths, weaknesses, and market gaps. This research revealed clear opportunities for differentiation—such as improving usability, delivering personalized content, and enhancing support for both job seekers and employers. These insights directly informed service improvements, content strategy, and outreach initiatives, helping WorkSourceWA better meet user needs and strengthen its market position across Washington State. Define Goal:&nbsp; The workforce website market in Washington is robust and multifaceted, focusing on bridging the gap between job seekers and employers while fostering economic development through targeted training and support services. Feature comparsion:&nbsp; <img width="2160" height="1208" width_o="2160" height_o="1208" data-src="https://freight.cargo.site/t/original/i/6dbf8df6f078c3e1d831e8ad282b49c4a3cb05575728e6e25e5cd7243018bd69/Screenshot-2025-09-10-at-14.34.31.png" data-mid="238013896" border="0" src="https://freight.cargo.site/w/1000/i/6dbf8df6f078c3e1d831e8ad282b49c4a3cb05575728e6e25e5cd7243018bd69/Screenshot-2025-09-10-at-14.34.31.png" /> Direct and Indirect competitors:&nbsp; <img width="3680" height="2788" width_o="3680" height_o="2788" data-src="https://freight.cargo.site/t/original/i/035b25b0e654cdfa207ef13273aa0cd9f1c8febcd2bf4a7fb8fb4d30087974fa/Direct-and-Indirect-competitors.png" data-mid="238014072" border="0" src="https://freight.cargo.site/w/1000/i/035b25b0e654cdfa207ef13273aa0cd9f1c8febcd2bf4a7fb8fb4d30087974fa/Direct-and-Indirect-competitors.png" /> Overview: <img width="4736" height="4528" width_o="4736" height_o="4528" data-src="https://freight.cargo.site/t/original/i/c8e5050de604b64198f1eff23638b93b8790756e15141821af3fd774122d4a3d/competitor-analysis_2.png" data-mid="238021597" border="0" src="https://freight.cargo.site/w/1000/i/c8e5050de604b64198f1eff23638b93b8790756e15141821af3fd774122d4a3d/competitor-analysis_2.png" /> <img width="4736" height="5808" width_o="4736" height_o="5808" data-src="https://freight.cargo.site/t/original/i/55753ddd9753075875054fa8787cf09c6d2a2ac5d20de89a53c8d93202fa56f9/competitor-analysis_3.png" data-mid="238021598" border="0" src="https://freight.cargo.site/w/1000/i/55753ddd9753075875054fa8787cf09c6d2a2ac5d20de89a53c8d93202fa56f9/competitor-analysis_3.png" /> <img width="4736" height="5280" width_o="4736" height_o="5280" data-src="https://freight.cargo.site/t/original/i/05a3967f9cf344779a53bc0961949bd38a14994de84d57dc224971f254cf65c3/competitor-analysis.png" data-mid="238021599" border="0" src="https://freight.cargo.site/w/1000/i/05a3967f9cf344779a53bc0961949bd38a14994de84d57dc224971f254cf65c3/competitor-analysis.png" /> Conclusion -&nbsp;How WorkSourceWA differentiate from competitors? <img width="2068" height="1768" width_o="2068" height_o="1768" data-src="https://freight.cargo.site/t/original/i/58ce038ee6f1adf82f157623fd781a3d1d82df4ef6e5edc33956a23ab9b700cb/summary_ca.png" data-mid="238025172" border="0" src="https://freight.cargo.site/w/1000/i/58ce038ee6f1adf82f157623fd781a3d1d82df4ef6e5edc33956a23ab9b700cb/summary_ca.png" /> <img width="2068" height="1408" width_o="2068" height_o="1408" data-src="https://freight.cargo.site/t/original/i/e45bd206f6081e8c281ed214b53961c0deece885aaa51b9c7707c49b785790a9/summary_ca2.png" data-mid="238025173" border="0" src="https://freight.cargo.site/w/1000/i/e45bd206f6081e8c281ed214b53961c0deece885aaa51b9c7707c49b785790a9/summary_ca2.png" /> <img width="2068" height="1840" width_o="2068" height_o="1840" data-src="https://freight.cargo.site/t/original/i/247aff18ccbdf287c9f25cc49bd1d7e1d6e8c390accef05dfa14f6a99add54eb/summary_ca3.png" data-mid="238025174" border="0" src="https://freight.cargo.site/w/1000/i/247aff18ccbdf287c9f25cc49bd1d7e1d6e8c390accef05dfa14f6a99add54eb/summary_ca3.png" /> <img width="2068" height="1920" width_o="2068" height_o="1920" data-src="https://freight.cargo.site/t/original/i/680ca59913f5d61ee434d3918b6c6cdc3104da6c0b92ba9e543a4b78b2375b26/summary_ca4.png" data-mid="238025175" border="0" src="https://freight.cargo.site/w/1000/i/680ca59913f5d61ee434d3918b6c6cdc3104da6c0b92ba9e543a4b78b2375b26/summary_ca4.png" /> <img width="2068" height="1480" width_o="2068" height_o="1480" data-src="https://freight.cargo.site/t/original/i/c43b84dbe8ef7a5b0533492f91591b641407dd49c9427456f053c8303275486f/summary_ca5.png" data-mid="238025176" border="0" src="https://freight.cargo.site/w/1000/i/c43b84dbe8ef7a5b0533492f91591b641407dd49c9427456f053c8303275486f/summary_ca5.png" /> <img width="2068" height="1552" width_o="2068" height_o="1552" data-src="https://freight.cargo.site/t/original/i/b34db6c6c35134baf6cda59d128724f83206b3e121896fcff6e931e4ac609c28/summary_ca6.png" data-mid="238025177" border="0" src="https://freight.cargo.site/w/1000/i/b34db6c6c35134baf6cda59d128724f83206b3e121896fcff6e931e4ac609c28/summary_ca6.png" /> <img width="2188" height="3880" width_o="2188" height_o="3880" data-src="https://freight.cargo.site/t/original/i/4b1949e0dec997535d624ca9f405533385aedaf478750cc152adb75c350c6701/summary_ca7.png" data-mid="238025178" border="0" data-scale="85" src="https://freight.cargo.site/w/1000/i/4b1949e0dec997535d624ca9f405533385aedaf478750cc152adb75c350c6701/summary_ca7.png" /> Week 3–4: Information Architecture Exploration Deliverables: Card Sorting Data Analysis – synthesized open and closed card sort results to identify mental models of users. Tree Test Analysis – validated user navigation expectations and identified areas of confusion. Leadership Highlight: Led the analysis of card sort and tree test data, extracting key user insights that informed IA decisions and aligned navigation structure with user expectations, accessibility standards, and state policy requirements. Card Sorting Analysis The goal of this research was to understand how users naturally group and categorize content on the WorkSourceWA platform. Specifically, the study aimed to explore: Whether users differentiate between authenticated (logged-in) and unauthenticated (public) content. How Spanish-speaking users organize and interpret WorkSourceWA content. How job seekers and employers sort shared or overlapping information relevant to both audiences. Outcome:The insights gained supported the ideation of meaningful category names and content groupings. This work directly contributed to enhancing site navigation, improving overall usability, and informing a more intuitive information architecture. User Task:Organize named items into categories that make sense to you and name each category. Key Findings:&nbsp;<img width="2796" height="1560" width_o="2796" height_o="1560" data-src="https://freight.cargo.site/t/original/i/fb2cbc957a53bbe0bb19e4b59762a77cef01d52fa77bba98847944032a4df9d9/Card-Sorting-Analysis-keyfinding.png" data-mid="238093816" border="0" src="https://freight.cargo.site/w/1000/i/fb2cbc957a53bbe0bb19e4b59762a77cef01d52fa77bba98847944032a4df9d9/Card-Sorting-Analysis-keyfinding.png" />Methodology: 1. Conducted Open Card&nbsp; Facilitated open card sorting sessions to explore how users naturally group and label content. <img width="1946" height="2671" width_o="1946" height_o="2671" data-src="https://freight.cargo.site/t/original/i/76557203baf87dcf4857087db09f07647e63c69b02f8da9f16ab20078888b34a/cardsoting-OW-1.png" data-mid="238094293" border="0" src="https://freight.cargo.site/w/1000/i/76557203baf87dcf4857087db09f07647e63c69b02f8da9f16ab20078888b34a/cardsoting-OW-1.png" /> 2. Data Analysis: Exploratory &amp; Statistical Exploratory Analysis: Identified patterns, themes, and user mental models based on qualitative input. Statistical Analysis: Applied quantitative methods to validate trends and measure consistency across participants. <img width="2929" height="2597" width_o="2929" height_o="2597" data-src="https://freight.cargo.site/t/original/i/269c043f38bd6bb9632cbaf1f5d22a398b7ba85ea9c99ec12a2ad66d9712c7f8/cardsoting-OW-martrix.png" data-mid="238094207" border="0" src="https://freight.cargo.site/w/1000/i/269c043f38bd6bb9632cbaf1f5d22a398b7ba85ea9c99ec12a2ad66d9712c7f8/cardsoting-OW-martrix.png" /> <img width="2695" height="2657" width_o="2695" height_o="2657" data-src="https://freight.cargo.site/t/original/i/b70e9e36294d90ca0e69afe73c57357e2ab57e940625101ec14a539e94eda351/cardsoting-OW-martrix2.png" data-mid="238094208" border="0" src="https://freight.cargo.site/w/1000/i/b70e9e36294d90ca0e69afe73c57357e2ab57e940625101ec14a539e94eda351/cardsoting-OW-martrix2.png" /> 3. Draft IA vs. User Findings Comparison (150 records) Evaluated alignment <img width="1386" height="624" width_o="1386" height_o="624" data-src="https://freight.cargo.site/t/original/i/bc889bb2585b11f5c72c6358ae549bb6631ed30d064f5d165cd39f72de3e1b9c/cardsoting-OW-martrix3.png" data-mid="238094211" border="0" src="https://freight.cargo.site/w/1000/i/bc889bb2585b11f5c72c6358ae549bb6631ed30d064f5d165cd39f72de3e1b9c/cardsoting-OW-martrix3.png" /> Challenge:&nbsp; Low participation rate
from Jobseekers SPA-13, employer EN -13, Employer SPA-0<img width="3896" height="5274" width_o="3896" height_o="5274" data-src="https://freight.cargo.site/t/original/i/86266ac3a2a6f3f88e2acd2140bab509a73a30a7f6967060add3d0f6b62b9656/cardsoting-OW-martrix4.png" data-mid="238094558" border="0" src="https://freight.cargo.site/w/1000/i/86266ac3a2a6f3f88e2acd2140bab509a73a30a7f6967060add3d0f6b62b9656/cardsoting-OW-martrix4.png" /> 4. Proposed Revised Information Architecture Developed a refined IA structure based on user insights, with improved categorization and navigation logic. <img width="2681" height="6604" width_o="2681" height_o="6604" data-src="https://freight.cargo.site/t/original/i/996f0be97fd0ab484d5ba68a6f96e2996084440ee003a4d48a547e0d5717cc99/revisedIA.png" data-mid="238094394" border="0" src="https://freight.cargo.site/w/1000/i/996f0be97fd0ab484d5ba68a6f96e2996084440ee003a4d48a547e0d5717cc99/revisedIA.png" /> Tree Testing Analysis The goal of this research was to evaluate the effectiveness of the revised Information Architecture (IA) in helping users easily navigate and find key content: IA Intuitiveness: Can users locate essential sections with ease? Content Findability: Are job listings, events, training resources, and office locators easy to find? Label Clarity &amp; Engagement: Are labels clear and descriptive enough to support sign-ups and engagement? Outcome:Unmoderated tree testing evaluated the draft WorkSourceWA IA, aiming to improve content findability and support account sign-ups, aligning with goals to enhance user experience and engagement. Key Findings: <img width="4002" height="2848" width_o="4002" height_o="2848" data-src="https://freight.cargo.site/t/original/i/e9bc1a61164e254f0d24ef271df6898956a5f7902083b7edcd8424124e012256/treetesting-OW.png" data-mid="238097592" border="0" src="https://freight.cargo.site/w/1000/i/e9bc1a61164e254f0d24ef271df6898956a5f7902083b7edcd8424124e012256/treetesting-OW.png" />Methodology: Tested draft IA based on preliminary card sort results for English speaking job seekers and employers, using Optimal Workshop, an unmoderated online tree testing tool Participants were asked to complete 10 of 16 randomized tasks using a simplified, text-only version of the site’s navigation (without design elements like menus or buttons). Participants had the option to provide comments about each task. Pre- and post-study questions were asked. Both English and Spanish versions of the test were launched on Sep 27, 2024 and closed Oct 5, 2024 (about 1 week) User Task:Complete the assigned goals by following the IA.&nbsp; <img width="1816" height="2075" width_o="1816" height_o="2075" data-src="https://freight.cargo.site/t/original/i/0e6c1762bdaa6ced79975b45dee387c313ffd189c88cb8ea5ef78c2dda8e1e72/treetesting-sample.png" data-mid="238098785" border="0" src="https://freight.cargo.site/w/1000/i/0e6c1762bdaa6ced79975b45dee387c313ffd189c88cb8ea5ef78c2dda8e1e72/treetesting-sample.png" /> Findings &amp; Analysis: (Total 16 taks) <img width="4316" height="3788" width_o="4316" height_o="3788" data-src="https://freight.cargo.site/t/original/i/33eddef4c7635fad1cdd3278e6deaef170ab9d9a5ce0632cfd969d2d7cbd2e5a/treetesting-OW6.png" data-mid="238099660" border="0" src="https://freight.cargo.site/w/1000/i/33eddef4c7635fad1cdd3278e6deaef170ab9d9a5ce0632cfd969d2d7cbd2e5a/treetesting-OW6.png" /> Overview: 1. Participants <img width="4660" height="1416" width_o="4660" height_o="1416" data-src="https://freight.cargo.site/t/original/i/d6617eef591626acba3370f97fab8cc3daf025199f7608f888b619351f6058d2/treetesting-OW2.png" data-mid="238098304" border="0" src="https://freight.cargo.site/w/1000/i/d6617eef591626acba3370f97fab8cc3daf025199f7608f888b619351f6058d2/treetesting-OW2.png" /> 2. Pre-study questions<img width="4638" height="1960" width_o="4638" height_o="1960" data-src="https://freight.cargo.site/t/original/i/28753dad46809b42e9a77ec1ddccd1a3647d623754b860832042b8eb1fc12411/treetesting-OW3.png" data-mid="238098329" border="0" src="https://freight.cargo.site/w/1000/i/28753dad46809b42e9a77ec1ddccd1a3647d623754b860832042b8eb1fc12411/treetesting-OW3.png" /><img width="4664" height="1923" width_o="4664" height_o="1923" data-src="https://freight.cargo.site/t/original/i/d386124de7c65a9a5b578490cd3425a49727def527d69a3f61a0e777252abf0f/treetesting-OW4.png" data-mid="238098330" border="0" src="https://freight.cargo.site/w/1000/i/d386124de7c65a9a5b578490cd3425a49727def527d69a3f61a0e777252abf0f/treetesting-OW4.png" /> 3. Key metrics <img width="2592" height="1778" width_o="2592" height_o="1778" data-src="https://freight.cargo.site/t/original/i/80fb0ac2e530b776122688ddf023062a1b6d642009abc6bb1428555da9b02f52/treetesting-OW5.png" data-mid="238098494" border="0" src="https://freight.cargo.site/w/1000/i/80fb0ac2e530b776122688ddf023062a1b6d642009abc6bb1428555da9b02f52/treetesting-OW5.png" /> <img width="4270" height="3784" width_o="4270" height_o="3784" data-src="https://freight.cargo.site/t/original/i/f10ab45f91dc93417e6b1148e4e2b07cb67f3535949c518ecf7ce85ee9996e47/treetesting-OW7.png" data-mid="238099751" border="0" src="https://freight.cargo.site/w/1000/i/f10ab45f91dc93417e6b1148e4e2b07cb67f3535949c518ecf7ce85ee9996e47/treetesting-OW7.png" /> Week 5–6: Content &amp; IA Design Deliverables: Information Architecture &amp; Taxonomy – reorganized content for clearer pathways and relevance. Content Governance Plan – established scalable workflows, content roles, and editorial standards. Leadership Highlight: Defined tagging and labeling systems to support future sitemap, CMS integration and search optimization.&nbsp; First draft of Taxonomy DesignTo improve content discoverability and relevance, I designed the initial taxonomy to categorize content in two key ways: By Topic – Organizing content by topics such as job searching, employer resources, training programs, and career advice helps users easily navigate and find information based on their specific interests or needs. By Role – Classifying content based on user roles—jobseekers, employers, and administrators—ensures that each audience group receives tailored content aligned with their goals and context. Additionally, when displaying related content, we can reference items within the same taxonomy row to surface more relevant and connected information. <img width="4464" height="4288" width_o="4464" height_o="4288" data-src="https://freight.cargo.site/t/original/i/0b6bdf028316e822f5bc1b7c5859c2f3a020851d796ce154931a3cfcf5f1cc0b/taxonomy.png" data-mid="238491587" border="0" src="https://freight.cargo.site/w/1000/i/0b6bdf028316e822f5bc1b7c5859c2f3a020851d796ce154931a3cfcf5f1cc0b/taxonomy.png" /> How do I adapt Taxonomy Design&nbsp;to the site map?Support Cross-Linking with Tags or MetadataUse taxonomy tags to connect content across different sections in the site map. This helps show related content or power smart search and filters. <img width="5356" height="2820" width_o="5356" height_o="2820" data-src="https://freight.cargo.site/t/original/i/560d21cafabb938dbcc28c4d10f7711fb6711542487df5081985abff9df9d204/taxonomy_usage2.png" data-mid="238497423" border="0" src="https://freight.cargo.site/w/1000/i/560d21cafabb938dbcc28c4d10f7711fb6711542487df5081985abff9df9d204/taxonomy_usage2.png" /> <img width="4396" height="2796" width_o="4396" height_o="2796" data-src="https://freight.cargo.site/t/original/i/2196f5bf31e483c33d37b4f3a28b9d5db3d88140fcd8753076d997985cafffe5/taxonomy_usage1.png" data-mid="238491866" border="0" src="https://freight.cargo.site/w/1000/i/2196f5bf31e483c33d37b4f3a28b9d5db3d88140fcd8753076d997985cafffe5/taxonomy_usage1.png" />Sitemap example<img width="3612" height="1686" width_o="3612" height_o="1686" data-src="https://freight.cargo.site/t/original/i/1da4d1b9fa002333fa97028ecc508c2e8d4cbb397c652a379cd81041287432d3/sitemap.png" data-mid="238591197" border="0" src="https://freight.cargo.site/w/1000/i/1da4d1b9fa002333fa97028ecc508c2e8d4cbb397c652a379cd81041287432d3/sitemap.png" />Week 7–10: Testing &amp; Iteration Deliverables: Usability Testing Report – conducted moderated tests on prototypes to validate IA and content clarity. Leadership Highlight: Aligned findings with policy and technical constraints. Methodology: Tested draft revised layout for job seekers&nbsp;&amp; employers (English &amp; Spanish) , using Figma prototype, and a heatmap to assist the user interview.&nbsp; User Task:Complete the assigned tasks, evaluate their level of difficulty, and share insights about your experience — including opinions, challenges, and any points of frustration.Overview:<img width="2102" height="1520" width_o="2102" height_o="1520" data-src="https://freight.cargo.site/t/original/i/808c8c5d8bc8a886e04310b8e44396f50946352c089763809ac7aec131c18127/usibility_3.png" data-mid="238933582" border="0" src="https://freight.cargo.site/w/1000/i/808c8c5d8bc8a886e04310b8e44396f50946352c089763809ac7aec131c18127/usibility_3.png" /> Heatmap - Findings &amp; Analysis: <img width="2960" height="2633" width_o="2960" height_o="2633" data-src="https://freight.cargo.site/t/original/i/57bf883bea925677da600fc6feafb2b291a3301a95af8dd4cf741d9d19edba5e/usibility_1.png" data-mid="238630693" border="0" src="https://freight.cargo.site/w/1000/i/57bf883bea925677da600fc6feafb2b291a3301a95af8dd4cf741d9d19edba5e/usibility_1.png" /><img width="2028" height="2238" width_o="2028" height_o="2238" data-src="https://freight.cargo.site/t/original/i/c319ca9fed0d5b2b86f47fbaa9d96d794140943a3181e10b951c2d65589ca4df/usibility_2.png" data-mid="238630692" border="0" src="https://freight.cargo.site/w/1000/i/c319ca9fed0d5b2b86f47fbaa9d96d794140943a3181e10b951c2d65589ca4df/usibility_2.png" /> Recommendations: <img width="5354" height="1600" width_o="5354" height_o="1600" data-src="https://freight.cargo.site/t/original/i/927949ab8f15f17806a3a51e6a40080e0736e8958855a892312777e746e9eba7/usibility_4.png" data-mid="238933586" border="0" src="https://freight.cargo.site/w/1000/i/927949ab8f15f17806a3a51e6a40080e0736e8958855a892312777e746e9eba7/usibility_4.png" /> <img width="5354" height="1696" width_o="5354" height_o="1696" data-src="https://freight.cargo.site/t/original/i/628443f4c0916b1e1dcacef05d32d4b64a91a0c476ad0972619a9c542cac66d7/usibility_5.png" data-mid="238933587" border="0" src="https://freight.cargo.site/w/1000/i/628443f4c0916b1e1dcacef05d32d4b64a91a0c476ad0972619a9c542cac66d7/usibility_5.png" /> <img width="3200" height="2080" width_o="3200" height_o="2080" data-src="https://freight.cargo.site/t/original/i/6b957bf10bddd6d7a92760a4aebc83970a7a48591fa9f2dd17968c41235c745b/usibility_6.png" data-mid="238933588" border="0" src="https://freight.cargo.site/w/1000/i/6b957bf10bddd6d7a92760a4aebc83970a7a48591fa9f2dd17968c41235c745b/usibility_6.png" /> Conclusion: Inspirational quote from our WorkSource customer: “I went to work Source recently because I wanted something simple that was not going to manipulate me. I know that every job, I hope this is true, I hope every job in Washington state is posted on this website and I hope that the jobs are real. And I know they're just a time- stamped ads, but I know that a real company posted it three weeks ago. So I can go to the company website and they're not trying to get me to click here and there to sort of manipulate their own numbers, but actually, these are good people here providing me genuine value. So yeah, I think you're on the right track and I think you've got a good thing going.” - EngJ2