https://victorchien.com Victor Chien Tue, 16 Jul 2024 16:19:29 +0000 https://victorchien.com en https://victorchien.com/Index Tue, 16 Jul 2024 16:18:33 +0000 Victor Chien https://victorchien.com/Index https://victorchien.com/IBM-TechZone-Design-System Tue, 16 Jul 2024 16:19:29 +0000 Victor Chien https://victorchien.com/IBM-TechZone-Design-System IBM TechZone Design System IBM Technology Zone (TechZone) is a sales tool for GTM teams and business partners to create technical environments, PoTs, prototypes, and more. While built with Carbon Design System, inconsistent component usage led to technical debt and a frustrating user experience. To address these issues, I created a custom design system tailored to TechZone's specific needs. This involved developing 15 custom components with variants. The new system streamlines development, simplifies maintenance, and ensures a consistent user experience, empowering users to navigate TechZone effortlessly and build PoTs efficiently. Role:Design LeadContribution: Art Direction Design SystemUser Research Team: Brooke Jones Joseph Hughes Tim Pomeroy Duration: Ongoing (10 weeks for initial launch) <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/2404582d0cb542a66ca80bf098e09653f7f2bf8c09f1689ce1f3bd4971257add/ITZ-Brand---Logo-2.png" data-mid="215146404" border="0" alt="Defining TechZone's brand to create a consistent yet distinct IBM product identity" data-caption="Defining TechZone's brand to create a consistent yet distinct IBM product identity" src="https://freight.cargo.site/w/1000/i/2404582d0cb542a66ca80bf098e09653f7f2bf8c09f1689ce1f3bd4971257add/ITZ-Brand---Logo-2.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/25c6b1e80b29f29296c405df3dde39274a46a0ac7018db58d763f13a5a140b4e/ITZ-Design-Components-Problem-Card.png" data-mid="215130349" border="0" alt="Previous tiles. Inconsistent use of tile components leads to technical debt and frustrating user experience" data-caption="Previous tiles. Inconsistent use of tile components leads to technical debt and frustrating user experience" src="https://freight.cargo.site/w/1000/i/25c6b1e80b29f29296c405df3dde39274a46a0ac7018db58d763f13a5a140b4e/ITZ-Design-Components-Problem-Card.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/75c830de9723afea25b5f7e8094221a3578840e54353e181a2a04c95f8fe7001/ITZ-Design-Components-Mock---All-Cards.png" data-mid="215664654" border="0" alt="Updated tiles. New tile components with re-defined use case and purpose" data-caption="Updated tiles. New tile components with re-defined use case and purpose" src="https://freight.cargo.site/w/1000/i/75c830de9723afea25b5f7e8094221a3578840e54353e181a2a04c95f8fe7001/ITZ-Design-Components-Mock---All-Cards.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/7dcb069ab0e3a86afd61acc53756e3b080b835a2066bded915bb24fd4415c6c6/ITZ-Design-Components-Mock---Search-page.png" data-mid="217348687" border="0" alt="New custom tile components on Search page" data-caption="New custom tile components on Search page" src="https://freight.cargo.site/w/1000/i/7dcb069ab0e3a86afd61acc53756e3b080b835a2066bded915bb24fd4415c6c6/ITZ-Design-Components-Mock---Search-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/676d21a629ae5736f80c4b81c850b3c97790d3ee831aeb00771f8fc95ab91f04/ITZ-Design-Components-Mock---Collection-page.png" data-mid="217252104" border="0" alt="Collection page with new tile component" data-caption="Collection page with new tile component" src="https://freight.cargo.site/w/1000/i/676d21a629ae5736f80c4b81c850b3c97790d3ee831aeb00771f8fc95ab91f04/ITZ-Design-Components-Mock---Collection-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/8bf9ccb16bf88e9d32d00daa0e636f89318b60936a99ccaad047ed6ebb70722b/ITZ-Design-Components-Mock---My-reservations-page.png" data-mid="217348652" border="0" alt="My reservations page with new 'reserved' tile components" data-caption="My reservations page with new 'reserved' tile components" src="https://freight.cargo.site/w/1000/i/8bf9ccb16bf88e9d32d00daa0e636f89318b60936a99ccaad047ed6ebb70722b/ITZ-Design-Components-Mock---My-reservations-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/cf02d74ccdb4b34ec35e272debb97ec9ee439969b5d21840e3abf2656a9e95fe/ITZ-Design-Components---Problem---Header.png" data-mid="215466042" border="0" alt="Previous pager header" data-caption="Previous pager header" src="https://freight.cargo.site/w/1000/i/cf02d74ccdb4b34ec35e272debb97ec9ee439969b5d21840e3abf2656a9e95fe/ITZ-Design-Components---Problem---Header.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/3df7d254dabce2310d7087d0138a7d5b5804267d7cc5077c489f1f8d26487db7/ITZ-Design-Components---Page-header.png" data-mid="215552088" border="0" alt="Updated page header" data-caption="Updated page header" src="https://freight.cargo.site/w/1000/i/3df7d254dabce2310d7087d0138a7d5b5804267d7cc5077c489f1f8d26487db7/ITZ-Design-Components---Page-header.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/bb400c04966fb7ca806ded1a066bd9f0fa3920642f14cfb6b7a1db73c461c823/ITZ-Design-Components-Mock---My-reservation-details-page.png" data-mid="217252242" border="0" alt="Page header on Reservation details page, which is most commonly used across TechZone" data-caption="Page header on Reservation details page, which is most commonly used across TechZone" src="https://freight.cargo.site/w/1000/i/bb400c04966fb7ca806ded1a066bd9f0fa3920642f14cfb6b7a1db73c461c823/ITZ-Design-Components-Mock---My-reservation-details-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/3ac523b86901e673cda47939c0d120784cdac9dd428b7b89c94a025e9da06e7e/ITZ-Design-Components-Mock---My-event-lab-details-page.png" data-mid="217252240" border="0" alt="Page header for Events or Labs page, which usually has longer description" data-caption="Page header for Events or Labs page, which usually has longer description" src="https://freight.cargo.site/w/1000/i/3ac523b86901e673cda47939c0d120784cdac9dd428b7b89c94a025e9da06e7e/ITZ-Design-Components-Mock---My-event-lab-details-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/e5c5172e30cec10cbb318a02a38850adc5bec9b74f0b11204498e68a6c4fcc91/ITZ-Design-Components-Mock---My-lab-details-page.png" data-mid="217252241" border="0" alt="Page header for Lab Details page, which has shorter description" data-caption="Page header for Lab Details page, which has shorter description" src="https://freight.cargo.site/w/1000/i/e5c5172e30cec10cbb318a02a38850adc5bec9b74f0b11204498e68a6c4fcc91/ITZ-Design-Components-Mock---My-lab-details-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/c5d927206b3291d91e909538e0080a5cfed6b4ed4be039b076777ad102ec07b4/ITZ-Design-Components-Mock---data-table.png" data-mid="215869491" border="0" alt="Data table component with updated key value pairs" data-caption="Data table component with updated key value pairs" src="https://freight.cargo.site/w/1000/i/c5d927206b3291d91e909538e0080a5cfed6b4ed4be039b076777ad102ec07b4/ITZ-Design-Components-Mock---data-table.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/f57b1750786e1e4033ee077fd590d51e312640cb26204d6d4ae90335a2ee8048/ITZ-Design-Components-Mock---Remote-console-page.png" data-mid="215795290" border="0" alt="Updated remote console tile" data-caption="Updated remote console tile" src="https://freight.cargo.site/w/1000/i/f57b1750786e1e4033ee077fd590d51e312640cb26204d6d4ae90335a2ee8048/ITZ-Design-Components-Mock---Remote-console-page.png" /> <img width="2880" height="1720" width_o="2880" height_o="1720" data-src="https://freight.cargo.site/t/original/i/583cc8a7ce514f75eac090f9a49eb86b5666b347c5c7be89d35912c75d8f93f5/ITZ-Design-Components-Mock---Modal-page.png" data-mid="217562238" border="0" alt="Updated modal screen" data-caption="Updated modal screen" src="https://freight.cargo.site/w/1000/i/583cc8a7ce514f75eac090f9a49eb86b5666b347c5c7be89d35912c75d8f93f5/ITZ-Design-Components-Mock---Modal-page.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/462f03133afa3449d0c242a8cdd3bc9b5ec976b7ed5f302c4a9297f1e5a05915/ITZ-Design-Components-Mock---key-value-pairs.png" data-mid="215876605" border="0" alt="Custom key value pairs tailored to TechZone's most common data sets and typography usage" data-caption="Custom key value pairs tailored to TechZone's most common data sets and typography usage" src="https://freight.cargo.site/w/1000/i/462f03133afa3449d0c242a8cdd3bc9b5ec976b7ed5f302c4a9297f1e5a05915/ITZ-Design-Components-Mock---key-value-pairs.png" /> How I solved the problem Identifying existing custom design components&nbsp;To assess TechZone's design customization, I conducted an audit of its components. I documented each component's details, including its description, location, and functionality. By comparing these to the Carbon Design System, I identified components unique to TechZone that required modification or updating. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/e311b62eaf10e2b549b374f3cece850497962b4d3c7f69d0694822946d9a4617/ITZ-Design-Components-audit.png" data-mid="215841826" border="0" alt="Auditing existing design components utilized in TechZone to identify any customizations" data-caption="Auditing existing design components utilized in TechZone to identify any customizations" src="https://freight.cargo.site/w/1000/i/e311b62eaf10e2b549b374f3cece850497962b4d3c7f69d0694822946d9a4617/ITZ-Design-Components-audit.png" /> Understanding user types: admin, IBMer, business partner, and their needsThere are 3 user types on TechZone: admin, IBMer, and business partner. Admins require the most detailed information, while business partners see the least. Understanding user types and information density allowed me to structure and design more accurately. Based on previous user interviews, we knew users preferred content with minimal clicks and appreciated a wealth of information. So the design challenge was to create flexible and branded design components that highlight various data sets but also accommodate the diverse needs of each user type while maintaining a consistent and visually appealing experience. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/94e92ee1d6145940520bb1a1755acaf31122ac41d0fbf1b73cf6111498139155/ITZ-Design-Components-Mock---persona-hierarchy.png" data-mid="216462334" border="0" alt="Information density on TechZone based on user type: admin &gt; IBMer &gt; business partner" data-caption="Information density on TechZone based on user type: admin &gt; IBMer &gt; business partner" src="https://freight.cargo.site/w/1000/i/94e92ee1d6145940520bb1a1755acaf31122ac41d0fbf1b73cf6111498139155/ITZ-Design-Components-Mock---persona-hierarchy.png" /> Capturing component requirements After understanding the target users, I collaborated with the product and development teams to define component requirements. This process involved determining the necessary information for each component and identifying potential categories or variants. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/a6192702013b0d7941b2aeefa6102047aa1e39772e57c9b6136f1768def25d35/ITZ-Design-Components---Requirements.png" data-mid="215892033" border="0" alt="Capturing requirements for each component" data-caption="Capturing requirements for each component" src="https://freight.cargo.site/w/1000/i/a6192702013b0d7941b2aeefa6102047aa1e39772e57c9b6136f1768def25d35/ITZ-Design-Components---Requirements.png" /> Balancing Carbon guidelines &amp; accessibility with alternative design solutions While Carbon guidelines provide a strong foundation, they can sometimes limit customization in areas like tooltips, tabs, and breadcrumbs due to accessibility standards and implementation constraints. To ensure a seamless experience on TechZone, I designed alternative or similar components that adhered to Carbon's principles while addressing specific customization needs. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/9918ef17b23115d78a10da9d5d2b61add482532556aeb096901b8934d203c4e1/ITZ-Design-Components-Mock---Accessibility.png" data-mid="216692224" border="0" alt="Accessibility testing status for the tab component in Carbon as of August 2024" data-caption="Accessibility testing status for the tab component in Carbon as of August 2024" src="https://freight.cargo.site/w/1000/i/9918ef17b23115d78a10da9d5d2b61add482532556aeb096901b8934d203c4e1/ITZ-Design-Components-Mock---Accessibility.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/ae04c76513f5df18450de6793cbd82b5eff1aaaf271683f5ef57f6afe23a2313/ITZ-Design-Components-Mock---Accessibility---Toggletip-2.png" data-mid="216756308" border="0" alt="Using other components to create alternative design solutions due to implementation accessibility issue" data-caption="Using other components to create alternative design solutions due to implementation accessibility issue" src="https://freight.cargo.site/w/1000/i/ae04c76513f5df18450de6793cbd82b5eff1aaaf271683f5ef57f6afe23a2313/ITZ-Design-Components-Mock---Accessibility---Toggletip-2.png" /> Designing variations &amp; testing I created design variations and conducted weekly reviews with the product and development teams. Usability testing validated the design choices, confirming users' preference for clear visual cues and minimal clicks to access information. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/6e469b5e983465339e67061c62e17c3b69b0515cee535b0b2cdc0556728e096e/ITZ-Design-Components-Mock---Design-explorations.png" data-mid="216757506" border="0" alt="Various design explorations for the components" data-caption="Various design explorations for the components" src="https://freight.cargo.site/w/1000/i/6e469b5e983465339e67061c62e17c3b69b0515cee535b0b2cdc0556728e096e/ITZ-Design-Components-Mock---Design-explorations.png" /> Implementing and updating components on TechZoneI began updating TechZone's designs with the completed components. I also collaborated with the development team to help create new components in Storybook. This ongoing project aims to enhance design consistency and streamline maintenance. <img width="2880" height="1720" width_o="2880" height_o="1720" data-src="https://freight.cargo.site/t/original/i/a34372795040f23f8763cae864147b37922248c8229a5a46b0d3ad3682e0714b/ITZ-Design-Components-Mock---Full-pages.png" data-mid="217562237" border="0" src="https://freight.cargo.site/w/1000/i/a34372795040f23f8763cae864147b37922248c8229a5a46b0d3ad3682e0714b/ITZ-Design-Components-Mock---Full-pages.png" /> https://victorchien.com/IBM-Apprentice-Database Tue, 16 Jul 2024 16:18:35 +0000 Victor Chien https://victorchien.com/IBM-Apprentice-Database IBM Apprentice Database The IBM Apprentice Database serves as a system of record for completion of the apprenticeship program. The apprentices are required to document their learning to meet requirements for the US Department of Labour. The tool is functional but has received a low NPS from apprentices and mentors. I worked as a part of the UX team to refine the experience, leading to increased user satisfaction.IBM is investing $250 million in apprenticeships and other new collar programs by 2025. It is part of one of IBM’s ESG (Environmental, Social, and Governance) goals, and investing in apprenticeships is a way for IBM to make an equitable impact by removing barriers to tech jobs while growing the talent pipeline. Role:UX DesignerContribution:PrototypingUI DesignUser Research Team:Josie Zuo FengjiaoLauren ScheckSamantha FariasDuration: 8 weeks <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/d86b8da42d1745d54b9853a30a30567e0b6c1708bb6fdbbf75eadb0430047646/IBM-DB-Apprentice-Homepage-Mock.png" data-mid="214759565" border="0" alt="Apprentice homepage " data-caption="Apprentice homepage " src="https://freight.cargo.site/w/1000/i/d86b8da42d1745d54b9853a30a30567e0b6c1708bb6fdbbf75eadb0430047646/IBM-DB-Apprentice-Homepage-Mock.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/a66f86d764763f89231954e0359263e634e3f2e6f4bdfaa221a6e4fc6f860fe4/IBM-DB-Apprentice-Homepage-Notidication-Mock.png" data-mid="214759566" border="0" src="https://freight.cargo.site/w/1000/i/a66f86d764763f89231954e0359263e634e3f2e6f4bdfaa221a6e4fc6f860fe4/IBM-DB-Apprentice-Homepage-Notidication-Mock.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/529280a863d074cfc2d8004dc79f1dbcedacb3e927348dac50e0a096eab4755c/IBM-DB-Apprentice-Competency-Mock.png" data-mid="214759567" border="0" alt="Apprentice competency framework page" data-caption="Apprentice competency framework page" src="https://freight.cargo.site/w/1000/i/529280a863d074cfc2d8004dc79f1dbcedacb3e927348dac50e0a096eab4755c/IBM-DB-Apprentice-Competency-Mock.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/b6a54de785245865d94e14812ff5b9cc9d570f4e5b2695ad8681f0c93a2b0bca/IBM-DB-Apprentice-Submit-Mock.png" data-mid="214759568" border="0" alt="Apprentice submission page" data-caption="Apprentice submission page" src="https://freight.cargo.site/w/1000/i/b6a54de785245865d94e14812ff5b9cc9d570f4e5b2695ad8681f0c93a2b0bca/IBM-DB-Apprentice-Submit-Mock.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/d29e4f5d43d0c539daf4a78cb42098f1ffcf36c2c057b3b38bd2702d9a608fb2/IBM-DB-Approver-Homepage-Mock.png" data-mid="214759569" border="0" alt="Approver homepage" data-caption="Approver homepage" src="https://freight.cargo.site/w/1000/i/d29e4f5d43d0c539daf4a78cb42098f1ffcf36c2c057b3b38bd2702d9a608fb2/IBM-DB-Approver-Homepage-Mock.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/840d16e5637477ba07b617b658449bdf77488f697acf9251076497484033081f/IBM-DB-Approver-Review-Mock.png" data-mid="214759570" border="0" alt="Approver review page" data-caption="Approver review page" src="https://freight.cargo.site/w/1000/i/840d16e5637477ba07b617b658449bdf77488f697acf9251076497484033081f/IBM-DB-Approver-Review-Mock.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/16131cb435ec4e7a2f30823b093633ba56229363008dc23d91218da08feac610/IBM-DB-Specs.png" data-mid="214759573" border="0" src="https://freight.cargo.site/w/1000/i/16131cb435ec4e7a2f30823b093633ba56229363008dc23d91218da08feac610/IBM-DB-Specs.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/04b2d66134b405b8cf926b547246b7c7ecc599631a5fc2dd69e91b97d329febe/IBM-DB-Impact.png" data-mid="214759572" border="0" src="https://freight.cargo.site/w/1000/i/04b2d66134b405b8cf926b547246b7c7ecc599631a5fc2dd69e91b97d329febe/IBM-DB-Impact.png" /> How I solved the problem What is IBM ApprenticeshipThe apprenticeship is a workforce training model combining paid on-the-job learning and formal classroom or online instruction to help workers master the knowledge, skills, and competencies needed for career success. The 3 components of the apprenticeship program include mentorship, competency framework, and learning. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/1bae261ddb264e7865c5f0f695b43ced0cef31b761a3e23b685ca08b7918f18c/IBM-DB-Design-Program.png" data-mid="214759575" border="0" alt="3 components of IBM Apprenticeship" data-caption="3 components of IBM Apprenticeship" src="https://freight.cargo.site/w/1000/i/1bae261ddb264e7865c5f0f695b43ced0cef31b761a3e23b685ca08b7918f18c/IBM-DB-Design-Program.png" /> Meet Noel, a UX apprentice who’s eager to learn new skillsWe conducted user interviews and developed a persona. Noel, a UX apprentice at IBM, is enthusiastic about learning new skills and contributing to the team's success. She seeks guidance from her mentor and manager to balance online learning with real projects and achieve her goal of securing a full-time position at IBM. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/693c6cee062318873aaf519844c39257c3e790c469ee8310efe3b3ff9eb9b8be/IBM-DB-Persona.png" data-mid="214759576" border="0" alt="Apprentice persona" data-caption="Apprentice persona" src="https://freight.cargo.site/w/1000/i/693c6cee062318873aaf519844c39257c3e790c469ee8310efe3b3ff9eb9b8be/IBM-DB-Persona.png" /> Key user challenges: documentation submission, database access, and mentor check-inBased on the findings, we developed an as-is journey map to gain deeper insights into users' current experiences and pinpoint the key challenges to address. These challenges primarily center around issues such as checking in with mentors, accessing the database, and submitting documentation. <img width="4408" height="2480" width_o="4408" height_o="2480" data-src="https://freight.cargo.site/t/original/i/477788c44e5901d04dbb063a5d3bfe29a4ec51da80816644734ca54b7949abb3/IBM-DB-as-is.png" data-mid="214759577" border="0" alt="As-is journey map to uncover user challenges" data-caption="As-is journey map to uncover user challenges" src="https://freight.cargo.site/w/1000/i/477788c44e5901d04dbb063a5d3bfe29a4ec51da80816644734ca54b7949abb3/IBM-DB-as-is.png" /> Apprentice pain points Unclear homepage instructions:The lack of clear instructions on the homepage leaves new apprentices feeling lost and confused. They struggle to understand the features and require extra effort to find what they need. Extensive scrolling &amp; expanding:Different roles have specific work processes and competencies to complete, resulting in a lengthy list of up to about 90 items. When apprentices search for content to document, extensive clicking and scrolling are required, making it difficult to locate relevant materials. Unclear documentation process: The process of documenting learning experiences is frustrating and inefficient. Assessment criteria are separated from the submission form, leading to confusion. Unclear field requirements and technical formatting issues further hinder the documentation process, resulting in a low NPS. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/e6e37b44b1b33a79d0d7dfd2ace7ac11d49bcb7e9335312b72a66b114153c951/IBM-DB-Apprentice-Homepage-Before.png" data-mid="214759578" border="0" alt="Apprentice homepage (before)" data-caption="Apprentice homepage (before)" src="https://freight.cargo.site/w/1000/i/e6e37b44b1b33a79d0d7dfd2ace7ac11d49bcb7e9335312b72a66b114153c951/IBM-DB-Apprentice-Homepage-Before.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/bf50c4c78b6539f06281aafda957eeca141120cd9225cad7630caf0342920509/IBM-DB-Apprentice-Submission-Before.png" data-mid="214759579" border="0" alt="Apprentice assessment criteria and submission page (before)" data-caption="Apprentice assessment criteria and submission page (before)" src="https://freight.cargo.site/w/1000/i/bf50c4c78b6539f06281aafda957eeca141120cd9225cad7630caf0342920509/IBM-DB-Apprentice-Submission-Before.png" /> Mentor (approver) pain points Unable to access review page directly: Mentors face difficulty when trying to review apprentice work after receiving an email notification. Clicking the link doesn't take them to the review page but to a general apprentice list. This requires manual searching to find the specific apprentice's work for review, making the process less efficient and more time-consuming. Struggle to reference while reviewing:Mentors must switch between pages or use an extra window to view assessment criteria during the review process of apprentices' work. Also, the terms 'mastery shortfall' and 'confirm evidence' confuse mentors, along with unclear button placement, causing hesitation and disrupting the assessment process. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/8149ebe25b3d5565c917e7708ff9de745d7027a118962b3b4788ec0182b5cb67/IBM-DB-Approver-To-Review.png" data-mid="214759580" border="0" src="https://freight.cargo.site/w/1000/i/8149ebe25b3d5565c917e7708ff9de745d7027a118962b3b4788ec0182b5cb67/IBM-DB-Approver-To-Review.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/b40f170c2abe9a19ee76c185743f942cc6a4500c6c1768047c0545c7c8df6f02/IBM-DB-Approver-Write-Up.png" data-mid="214759581" border="0" src="https://freight.cargo.site/w/1000/i/b40f170c2abe9a19ee76c185743f942cc6a4500c6c1768047c0545c7c8df6f02/IBM-DB-Approver-Write-Up.png" /> “Create an interface that allows apprentices to easily document work processes and competencies through a seamless user interaction that increases user engagement.” Based on the feedback we consolidated from user interviews, we created goals for each step users take to complete the process. Then, we concluded a design goal for this project. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/ab83eac13c1e1619642e6760ef89a8e244cf17401169a519946d67c7687da4d7/IBM-DB-Design-Goal.png" data-mid="214759582" border="0" src="https://freight.cargo.site/w/1000/i/ab83eac13c1e1619642e6760ef89a8e244cf17401169a519946d67c7687da4d7/IBM-DB-Design-Goal.png" /> Feature prioritization for an enhanced submission experience After meeting with stakeholders to review user feedback and objectives, we prioritized features to assess feasibility, including: Filtered by submission status, due date, and nameSubmit learnings while viewing submission guidanceVisual overview to see progress at a glance <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/90b7014936a6a494addfb41e4cc7319a1cd8c2599a2fbd6fae8b9b3a94439932/IBM-DB-Prioritization.png" data-mid="214759583" border="0" src="https://freight.cargo.site/w/1000/i/90b7014936a6a494addfb41e4cc7319a1cd8c2599a2fbd6fae8b9b3a94439932/IBM-DB-Prioritization.png" /> Design explorations, from low-fi to high-fi <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/13c244819a308668c0bb296a23e03d5e78f3ebb00c39bf4a089f16f006cac12a/IBM-DB-Lo-fi.png" data-mid="214759584" border="0" src="https://freight.cargo.site/w/1000/i/13c244819a308668c0bb296a23e03d5e78f3ebb00c39bf4a089f16f006cac12a/IBM-DB-Lo-fi.png" /> Solution Highlighting progress on homepageThe apprentice homepage is a one-stop view for tracking their progress in the apprenticeship. It shows individual completions for tasks and competencies, eliminating the need to switch between tools. The homepage also highlights any outstanding items, making it easy for apprentices to pick up where they left off or quickly address resubmissions, leading to more timely completion of tasks. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/8a4fe64e6bb973745cd5471dced79a6919ce45356579621e0a8a1cf030651968/IBM-DB-Apprentice-Progress-Management.png" data-mid="214759585" border="0" src="https://freight.cargo.site/w/1000/i/8a4fe64e6bb973745cd5471dced79a6919ce45356579621e0a8a1cf030651968/IBM-DB-Apprentice-Progress-Management.png" /> Improving search &amp; navigation with filter and grid systemThe updated competency framework page addresses two issues with the previous experience: users struggling to quickly find content and facing navigation challenges due to a long scroll and extra clicks. The new design enhances searchability by enabling users to search by title and filter by status and type, facilitating a quicker and more focused search for apprentices. The layout is revamped from a list view to a tile view on a 4-column grid system, displaying more content on a single page and minimizing the need for excessive scrolling and clicking. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/aee160e70ea7f5b70197493914123aa223989f0f863669b7668745efa94bc79f/IBM-DB-Apprentice-Competency-Framework-Grid-Mock.png" data-mid="214759586" border="0" alt="New competency framework page with improved search and navigation" data-caption="New competency framework page with improved search and navigation" src="https://freight.cargo.site/w/1000/i/aee160e70ea7f5b70197493914123aa223989f0f863669b7668745efa94bc79f/IBM-DB-Apprentice-Competency-Framework-Grid-Mock.png" /> Providing clear submission &amp; review guidelinesThe new submission page offers clear and accessible guidelines alongside required fields with prominent indicators, empowering apprentices to submit their work with confidence and minimize errors. Approvers benefit from readily available review guidelines displayed on the page and unambiguous button labels, facilitating efficient and accurate assessments. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/17718a4dbb2bae32240707241eeb891caa26d9065eb4b1b35e9d9077d3be67f5/IBM-DB-Guides.png" data-mid="214759587" border="0" src="https://freight.cargo.site/w/1000/i/17718a4dbb2bae32240707241eeb891caa26d9065eb4b1b35e9d9077d3be67f5/IBM-DB-Guides.png" /> Quick submission review &amp; apprentice managementThe mentor homepage now features an apprentice submission review table, presenting items requiring the mentor's attention. This enhances the page navigation and task completion. Additionally, the homepage now displays the mentor's current apprentices. This provides a quick overview of each apprentice's contact details, program start/end dates, and their progress. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/6082213aec433ab0e4b87c70f9f7eb0b18871509c48699f22c847fe926d7c43a/IBM-DB-Approver-Apprentice-Management.png" data-mid="214759588" border="0" alt="New mentor homepage features a submission review table and current apprentices for better management" data-caption="New mentor homepage features a submission review table and current apprentices for better management" src="https://freight.cargo.site/w/1000/i/6082213aec433ab0e4b87c70f9f7eb0b18871509c48699f22c847fe926d7c43a/IBM-DB-Approver-Apprentice-Management.png" /> User testing: positive user satisfaction compared to previous designDue to time constraints, we opted for a Likert-style survey to validate the designs. The new competency frameworks page demonstrates a significant improvement, with score increasing from 2.67 to 4.33 out of 5. Also, the homepage receives a score of 4.67 out of 5, marking a +62% improvement in user satisfaction. This indicates a positive response and heightened user satisfaction compared to the previous design. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/699634b1dcb63727b4cd18afd141233d8f4eb390fba88f88bbdbf3b13eaabe3a/IBM-DB-User-Test.png" data-mid="214759589" border="0" alt="New competency framework page received +62% improvement in user satisfaction" data-caption="New competency framework page received +62% improvement in user satisfaction" src="https://freight.cargo.site/w/1000/i/699634b1dcb63727b4cd18afd141233d8f4eb390fba88f88bbdbf3b13eaabe3a/IBM-DB-User-Test.png" /> https://victorchien.com/Currenxie-Web-App-Mobile-App Tue, 16 Jul 2024 16:18:45 +0000 Victor Chien https://victorchien.com/Currenxie-Web-App-Mobile-App Currenxie Web App &amp; Mobile App Currenxie /’kur-uhn-see’/, a Hong Kong-based fintech company offering a one-stop finance app for international business payments, partnered with Visa to launch a corporate card. However, their existing mobile app, limited to Android and lacking key features like money transfers, hindered user engagement and wasn't ready to support the new card. To address this challenge and capitalize on the Visa partnership, I redesigned the web and mobile apps, creating a unified experience that empowers users to manage spending, cards, and transactions seamlessly across all platforms, while reflecting Currenxie's fresh brand identity. The redesign led to a surge in user engagement, positive reviews, and increased money transfers and app downloads. These improvements culminated in Currenxie securing a $10M Series A funding round, demonstrating strong investor confidence in the platform's future. Role:Lead designerContribution:Design SystemUI DesignUser Research Team:Fahd KasriKris GerardssoMariem Ben AyedSam CoyneTatiana Filippov Duration:18 months <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/0c8e676bb113410168ea1cb36e2d9973c2e610cda7c9504ce5d48b78ada1071e/CX-App-Before.png" data-mid="214759690" border="0" alt="Previous design. Transfers were only available on web app" data-caption="Previous design. Transfers were only available on web app" src="https://freight.cargo.site/w/1000/i/0c8e676bb113410168ea1cb36e2d9973c2e610cda7c9504ce5d48b78ada1071e/CX-App-Before.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/ff5c8db883012dc23beca738b4cfe22ed602b69a28d465958c8871aaa32c34b2/CX-App-After.png" data-mid="214759689" border="0" alt="Updated design" data-caption="Updated design" src="https://freight.cargo.site/w/1000/i/ff5c8db883012dc23beca738b4cfe22ed602b69a28d465958c8871aaa32c34b2/CX-App-After.png" /> <img width="2160" height="1536" width_o="2160" height_o="1536" data-src="https://freight.cargo.site/t/original/i/27637d411469d8f8272c89d63302aa8ce1df56b56d90cf115c173050430e8db3/Currenxie-WebApp-Home-Skeleton-2.gif" data-mid="214759590" border="0" src="https://freight.cargo.site/w/1000/i/27637d411469d8f8272c89d63302aa8ce1df56b56d90cf115c173050430e8db3/Currenxie-WebApp-Home-Skeleton-2.gif" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/82596d4d9f20da01cd7402beb8fdcd42b468cbd1a82af5dff29f6ca9c77e8039/CX-App-Transactions.png" data-mid="214759691" border="0" alt="Managing multi-account transations on Currenxie web app" data-caption="Managing multi-account transations on Currenxie web app" src="https://freight.cargo.site/w/1000/i/82596d4d9f20da01cd7402beb8fdcd42b468cbd1a82af5dff29f6ca9c77e8039/CX-App-Transactions.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/8915a160150bcd617a4161594956c8fd2231742014377d3596f61434085b4e5b/CX-App-Transfer-Mobile.png" data-mid="214759693" border="0" alt="Making a transfer on Currenxie mobile app" data-caption="Making a transfer on Currenxie mobile app" src="https://freight.cargo.site/w/1000/i/8915a160150bcd617a4161594956c8fd2231742014377d3596f61434085b4e5b/CX-App-Transfer-Mobile.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/bc3ca1fbdeeb791a999b2900915f941e1bf4da06ea19d3d0d459cd24a9f433ea/CX-App-Cards-Web-Mobile.png" data-mid="214759695" border="0" alt="Multi-account management" data-caption="Multi-account management" src="https://freight.cargo.site/w/1000/i/bc3ca1fbdeeb791a999b2900915f941e1bf4da06ea19d3d0d459cd24a9f433ea/CX-App-Cards-Web-Mobile.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/d8cb8d7e82d70f91220f26366b5d194b0cf013a663321169ca5fa98ff0cf2084/CX-App-Spending-Limit.png" data-mid="214759694" border="0" alt="Setting up a spending limit for cardholders" data-caption="Setting up a spending limit for cardholders" src="https://freight.cargo.site/w/1000/i/d8cb8d7e82d70f91220f26366b5d194b0cf013a663321169ca5fa98ff0cf2084/CX-App-Spending-Limit.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/a2a6726293d33e224764b229c4565e74d90dfc12c2c6ca231223170fa767ff24/CX-App-Request-Card-Mobile.png" data-mid="214759697" border="0" alt="Requesting a VISA card on Currenxie mobile app" data-caption="Requesting a VISA card on Currenxie mobile app" src="https://freight.cargo.site/w/1000/i/a2a6726293d33e224764b229c4565e74d90dfc12c2c6ca231223170fa767ff24/CX-App-Request-Card-Mobile.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/0e2dae35880cfc7ed7b43a625075aca637d8635983d59f413b3184937530e12c/CX-App-Setting-up.png" data-mid="214759698" border="0" alt="Step-by-step instructions on setting up a Currenxie account" data-caption="Step-by-step instructions on setting up a Currenxie account" src="https://freight.cargo.site/w/1000/i/0e2dae35880cfc7ed7b43a625075aca637d8635983d59f413b3184937530e12c/CX-App-Setting-up.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/9731fba65fac9d77757509a2f26bc9e9341a50a469d0ffbf9a578a5cde16c5d5/CX-App-App-Store.png" data-mid="214759692" border="0" src="https://freight.cargo.site/w/1000/i/9731fba65fac9d77757509a2f26bc9e9341a50a469d0ffbf9a578a5cde16c5d5/CX-App-App-Store.png" /> How I solved the problem Setting up guiding principles to define successTo start the process, I worked with Marketing and Product Owner to create guiding principles to define success based on the new marketing and product strategies. <img width="2880" height="1600" width_o="2880" height_o="1600" data-src="https://freight.cargo.site/t/original/i/ecfcfca59e8b32e3b2ecd9c747ecf892ac98b4b99e5ea7c892e54f87003b5158/CX-App-Design-Principles.png" data-mid="218068117" border="0" alt="Guiding principles for defining success" data-caption="Guiding principles for defining success" src="https://freight.cargo.site/w/1000/i/ecfcfca59e8b32e3b2ecd9c747ecf892ac98b4b99e5ea7c892e54f87003b5158/CX-App-Design-Principles.png" /> Journey map: uncovering the need to streamline application formsApplying for a Currenxie Visa card requires a pre-existing Currenxie Global Account, or users need to go through a separate application and account approval process. It's complex, lacks guidance, and offers no timeframe for completion. Understanding these pain points helps inform the Visa card application and streamline the existing Global Account application process, creating smoother user experiences. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/ef2f8ae5400bf6a665ae20f434f4fe48d0b17e74de8575a1ca2b5d0f46ec9f48/CX-User-Journey.png" data-mid="214759700" border="0" alt="User journey for the Currenxie Global Account application" data-caption="User journey for the Currenxie Global Account application" src="https://freight.cargo.site/w/1000/i/ef2f8ae5400bf6a665ae20f434f4fe48d0b17e74de8575a1ca2b5d0f46ec9f48/CX-User-Journey.png" /> User flow: discovering key information user needsTo gain a holistic view of the Visa card application process, I created user flows for admin users. Through this analysis, I learned the key information admin users prioritize: application status, date, cardholder details, and transaction amounts. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/664d385352cb1638132028346f6314cda2d8995d26b99934e0f297d2275980b8/CX-App-Admin-User-2.png" data-mid="219735043" border="0" alt="How an admin user (card holder) goes through the application process" data-caption="How an admin user (card holder) goes through the application process" src="https://freight.cargo.site/w/1000/i/664d385352cb1638132028346f6314cda2d8995d26b99934e0f297d2275980b8/CX-App-Admin-User-2.png" /> Design exploration: prioritizing core functionalities&nbsp;I began creating designs to help stakeholders and leadership visualize the real-world application of the new features. Based on several discussions, the team decided to prioritize core functionalities and remove FX rates as they were not considered essential for the MVP. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/c051c29c6198c8d2bdaeb4e8e1db509697440d209dafd165bbcc62790e66c2bd/CX-App-Design-Explorations.png" data-mid="214759701" border="0" src="https://freight.cargo.site/w/1000/i/c051c29c6198c8d2bdaeb4e8e1db509697440d209dafd165bbcc62790e66c2bd/CX-App-Design-Explorations.png" /> Testing &amp; iteration: Replacing confusing icons with dropdown menu User testing with existing select clients showed challenges managing cardholder permissions in settings. Participants expressed confusion about the icons. To address this and expedite development, I replaced them with a dropdown menu, aligning with our goal of minimizing user time spent making permission changes. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/1922d7c00df6c5a831f0d4171a2f0605a76bce95cd4bb7535b48a88109bdc50f/CX-App-Manage-Before.png" data-mid="214759702" border="0" alt="Before" data-caption="Before" src="https://freight.cargo.site/w/1000/i/1922d7c00df6c5a831f0d4171a2f0605a76bce95cd4bb7535b48a88109bdc50f/CX-App-Manage-Before.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/9af00ff1b985fcbfd1ad6579449ecd11bbeff8627ab36bfd5010f20e09fc6c9f/CX-App-Manage-After.png" data-mid="214759703" border="0" alt="After" data-caption="After" src="https://freight.cargo.site/w/1000/i/9af00ff1b985fcbfd1ad6579449ecd11bbeff8627ab36bfd5010f20e09fc6c9f/CX-App-Manage-After.png" /> Solution Highlighting key data with minimal visual densityTo help users better monitor transactions of each account, I highlighted key data using a minimal visual density by showing what is essential—status, date, cardholder, and amount. I also added a color-coded spending indication. It requires less effort for users to process information and provides visual clarity. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/054d1f2f0bf5395ba42319545e7821be3e472e574dd1106afdd44124293d9451/CX-App-Highlight-Visual-Density.png" data-mid="214759705" border="0" alt="Highlighting key data with minimal visual density" data-caption="Highlighting key data with minimal visual density" src="https://freight.cargo.site/w/1000/i/054d1f2f0bf5395ba42319545e7821be3e472e574dd1106afdd44124293d9451/CX-App-Highlight-Visual-Density.png" /> Building trust through transparencyTo maintain user trust and avoid confusion, I implemented transparent fee structures. By clearly displaying fees upfront, before a transfer is initiated, users are informed of all charges associated with the transaction. This eliminates last-minute surprises and fosters a sense of trust and clarity in the user-business relationship. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/4778481eb5af71f8d00fe1dedb6e03cf55f284045be8a38473bfe219cf2c3121/CX-App-Trust-Via-Transparency.png" data-mid="214759706" border="0" alt="Showing users additional charges before making a transfer" data-caption="Showing users additional charges before making a transfer" src="https://freight.cargo.site/w/1000/i/4778481eb5af71f8d00fe1dedb6e03cf55f284045be8a38473bfe219cf2c3121/CX-App-Trust-Via-Transparency.png" /> Simplifying application journey with progress tracking To streamline the application process and manage user expectations, I implemented a 4-step breakdown with a progress bar. This upfront transparency informs users of the application steps before they begin, and the progress bar allows them to track their progress throughout, minimizing confusion. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/40b02bedcbece8d076931ec4ff3a76bfe87005d2c621d75c9977c3fb5a9ef8e9/CX-App-Progress-Bar.png" data-mid="214759707" border="0" alt="Adding a progress bar to show the application process" data-caption="Adding a progress bar to show the application process" src="https://freight.cargo.site/w/1000/i/40b02bedcbece8d076931ec4ff3a76bfe87005d2c621d75c9977c3fb5a9ef8e9/CX-App-Progress-Bar.png" /> Scaling brand guidelines into design systems for consistency and collaboration To facilitate better collaboration and project hand-off, I expanded the brand guidelines of the website into a component library. This also ensures that the cross-device experiences are seamless for users. <img width="2940" height="2818" width_o="2940" height_o="2818" data-src="https://freight.cargo.site/t/original/i/a867d9394820dca4f3422e512c8a55e90cb8177b280195a5f78ffb3cb9a3994a/Currenxie-Mobile-App-design-system-2.png" data-mid="214759655" border="0" src="https://freight.cargo.site/w/1000/i/a867d9394820dca4f3422e512c8a55e90cb8177b280195a5f78ffb3cb9a3994a/Currenxie-Mobile-App-design-system-2.png" /> https://victorchien.com/Currexie-Brand-Website Tue, 16 Jul 2024 16:19:04 +0000 Victor Chien https://victorchien.com/Currexie-Brand-Website Currenxie Brand &amp; Website Currenxie /’kur-uhn-see’/ offers a one-stop app for payments, currency exchange, and virtual accounts, streamlining international finance for businesses. However, an outdated brand, a bootstrap-themed website, and generic stock images all failed to reflect their innovative approach and hindered growth and brand connection. A brand refresh and website redesign were needed to bridge the gap and reflect its updated brand identity.I led a rebrand that embodied reliability, innovation, and modernity, reflected through a website redesign that strengthened brand experience and content discoverability. This resulted in a doubled session duration, 50% traffic increase, and 15% conversion boost. Additionally, I established a brand-aligned design system to optimize development and team collaboration. Role:Lead designer Contribution:Art Direction Brand IdentityVisual Design Team:Fahd KasriKris GerardssonSam CoyneTatiana Filippova Duration: 6 months <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/dd0fda66ffc8b30ec7ac1822832c123bae2d14cd7c23c86e97d5514532542b87/CX-Website-Mobile.png" data-mid="214759884" border="0" src="https://freight.cargo.site/w/1000/i/dd0fda66ffc8b30ec7ac1822832c123bae2d14cd7c23c86e97d5514532542b87/CX-Website-Mobile.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/4d74c4ba55204da6e2a70bdb75c0e9fffb88422576cdfe48d9a1e3a92f98fb9b/CX-Website-Homepage-Mock_Before.png" data-mid="214759887" border="0" alt="Before" data-caption="Before" src="https://freight.cargo.site/w/1000/i/4d74c4ba55204da6e2a70bdb75c0e9fffb88422576cdfe48d9a1e3a92f98fb9b/CX-Website-Homepage-Mock_Before.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/0dfb4a30ee83374aad8795d32b5aa616f058bde85673bf9ab87c19cf385e9c7c/CX-Website-Homepage-Mock_After.png" data-mid="214759885" border="0" alt="After" data-caption="After" src="https://freight.cargo.site/w/1000/i/0dfb4a30ee83374aad8795d32b5aa616f058bde85673bf9ab87c19cf385e9c7c/CX-Website-Homepage-Mock_After.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/4942bacc9aa235cfaf7c6f1f29e814ecaf67b541b617a393c52311cb2d89e881/CX-Website-RTB.png" data-mid="214759888" border="0" src="https://freight.cargo.site/w/1000/i/4942bacc9aa235cfaf7c6f1f29e814ecaf67b541b617a393c52311cb2d89e881/CX-Website-RTB.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/de8aa02f33d1de5b3bc485541c0f34c1d3bcb3b6b4bcd65d1f41db2687dc6548/CX-Website-Our-Team.png" data-mid="214759889" border="0" src="https://freight.cargo.site/w/1000/i/de8aa02f33d1de5b3bc485541c0f34c1d3bcb3b6b4bcd65d1f41db2687dc6548/CX-Website-Our-Team.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/edb36c7cde285a266960eef6cacefc9a86d9effdb6113222e9e0acf49d160ce8/CX-Website-FAQ.png" data-mid="214759890" border="0" src="https://freight.cargo.site/w/1000/i/edb36c7cde285a266960eef6cacefc9a86d9effdb6113222e9e0acf49d160ce8/CX-Website-FAQ.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/3c7e7cf0ca208d76b9b55d142a3ee1c63c68975b8e0912c0c74ae4c37d13a0ae/CX-Website-Mobile-View.png" data-mid="214759891" border="0" alt="Mobile view of Currenxie's product page, navigation, careers page" data-caption="Mobile view of Currenxie's product page, navigation, careers page" src="https://freight.cargo.site/w/1000/i/3c7e7cf0ca208d76b9b55d142a3ee1c63c68975b8e0912c0c74ae4c37d13a0ae/CX-Website-Mobile-View.png" /> <img width="2500" height="1406" width_o="2500" height_o="1406" data-src="https://freight.cargo.site/t/original/i/7844f961c411702ce5c4107ef94a24bd77a0358807f7f9c5ce5a7784ef781609/Currenxie-case-study-icons.png" data-mid="214759838" border="0" alt="New icon system to increase written communication" data-caption="New icon system to increase written communication" src="https://freight.cargo.site/w/1000/i/7844f961c411702ce5c4107ef94a24bd77a0358807f7f9c5ce5a7784ef781609/Currenxie-case-study-icons.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/60aa51019480dcf511b15f0379a0739a3db45d8e2440611950b6040c9d5d2156/Currenxie-Icons-Ani_Black.png" data-mid="214759805" border="0" src="https://freight.cargo.site/w/1000/i/60aa51019480dcf511b15f0379a0739a3db45d8e2440611950b6040c9d5d2156/Currenxie-Icons-Ani_Black.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/63ecb1c14b7ed936ca6c2ad2c941605af46bf0539bd504172524280d5df07e55/CX-Website-Template-Mock.png" data-mid="214759892" border="0" alt="Master templates with a 12-col grid system" data-caption="Master templates with a 12-col grid system" src="https://freight.cargo.site/w/1000/i/63ecb1c14b7ed936ca6c2ad2c941605af46bf0539bd504172524280d5df07e55/CX-Website-Template-Mock.png" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/13ac4e366f6ed1803d1094cc9016347a98519f8334733fb3d201929886364b26/Currenxie-Logo-Ani5.gif" data-mid="214759792" border="0" src="https://freight.cargo.site/w/1000/i/13ac4e366f6ed1803d1094cc9016347a98519f8334733fb3d201929886364b26/Currenxie-Logo-Ani5.gif" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/be1bfd9e66a013ca557997c85c876a5636be55c7ffc6fdaed9daaf10fb9a4a8d/CX-Website-Brand-Voice.png" data-mid="214759895" border="0" src="https://freight.cargo.site/w/1000/i/be1bfd9e66a013ca557997c85c876a5636be55c7ffc6fdaed9daaf10fb9a4a8d/CX-Website-Brand-Voice.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/ef387f94dfa67dc2df97dae16aee713a1198e150ea9537cc8270e72a3b0790e7/CX-Website-Typogrpahy.png" data-mid="214759896" border="0" src="https://freight.cargo.site/w/1000/i/ef387f94dfa67dc2df97dae16aee713a1198e150ea9537cc8270e72a3b0790e7/CX-Website-Typogrpahy.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/a67653b4e88d1cefc4a6682858a6fb01d8f75d5d488c8d735b9fddca2bd924fc/CX-Brand-Guidelines.png" data-mid="214759893" border="0" alt="Brand guidelines to ensure the new brand is communicated consistently and correctly" data-caption="Brand guidelines to ensure the new brand is communicated consistently and correctly" src="https://freight.cargo.site/w/1000/i/a67653b4e88d1cefc4a6682858a6fb01d8f75d5d488c8d735b9fddca2bd924fc/CX-Brand-Guidelines.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/b834c935aafcf77ba925568f03751503098dcf39f76b602cb1564792527fbefb/CX-Brand-Stationary.png" data-mid="214759894" border="0" src="https://freight.cargo.site/w/1000/i/b834c935aafcf77ba925568f03751503098dcf39f76b602cb1564792527fbefb/CX-Brand-Stationary.png" /> How I solved the problem Learnings from industry leaders: opportunity to leverage social proof to increase engagementI analyzed competitor websites like Airwallex and Revolut. Key takeaways include produt snapshots for quick grasp of functionalities and benefits. Notably, none of the competitors prominently featured testimonials, a potential opportunity to leverage social proof and build trust, further impacting user engagement and conversion rates. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/e6d10b253d075a6bc6b655a7ec07f9afaec77b7bc6193cf07dc98790e0105207/CX-Website-Competitive-Analysis.png" data-mid="214759897" border="0" alt="Revolut (left), Airwallex (middle), Neat (right)" data-caption="Revolut (left), Airwallex (middle), Neat (right)" src="https://freight.cargo.site/w/1000/i/e6d10b253d075a6bc6b655a7ec07f9afaec77b7bc6193cf07dc98790e0105207/CX-Website-Competitive-Analysis.png" /> Revamping sitemap for clarityAfter a thorough analysis of existing website structures and conducting in-depth desk research, I've created a sitemap for the new website, outlining the hierarchy and organization of all the pages. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/d2184a627729f29b7958bfbe7e7db869f7224a9df2b0ca5d74fe03a0704eadbb/Currenxie-website-sitemap-2.png" data-mid="214759898" border="0" alt="New sitemap for Currenxie's new website" data-caption="New sitemap for Currenxie's new website" src="https://freight.cargo.site/w/1000/i/d2184a627729f29b7958bfbe7e7db869f7224a9df2b0ca5d74fe03a0704eadbb/Currenxie-website-sitemap-2.png" /> Developing design concepts to address identified problems Streamlined feature introduction:Clear step process introduces the main feature, facilitating user understanding. Industry leadership showcase: Curated client list highlights Currenxie's leading position in the industry. Enhanced user support: Structured and detailed FAQ section with clear searchability helps users locate answers quickly. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/487a3ee4a67781276f52c5cae0e781c08bd6887fa24b7c034ee49d1daeb78774/CX-Website-Design-Explorations.png" data-mid="214759899" border="0" alt="Early design concepts" data-caption="Early design concepts" src="https://freight.cargo.site/w/1000/i/487a3ee4a67781276f52c5cae0e781c08bd6887fa24b7c034ee49d1daeb78774/CX-Website-Design-Explorations.png" /> <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/1c50ec40c1d193278daef2f419eb1738f7e0a2fb106232d30fac4d95366ce736/CX-Website-Design-Explorations-2.png" data-mid="214759900" border="0" alt="Design explorations addressing identified problems" data-caption="Design explorations addressing identified problems" src="https://freight.cargo.site/w/1000/i/1c50ec40c1d193278daef2f419eb1738f7e0a2fb106232d30fac4d95366ce736/CX-Website-Design-Explorations-2.png" /> User testing: faster completion, fewer errors, and higher satisfactionI conducted a moderated user test to assess the usability of different design approaches. Key metrics included completion rate, user error rate, user satisfaction. The results showed option A to be significantly faster and easier to use, resulting in fewer errors and higher satisfaction among participants. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/0ef7bd8de58d6e5b0c01b30899f9e53ad11f4b3b2cc6386bd1ea92cd7d3f7ee6/CX-Website-User-Testing.png" data-mid="214759901" border="0" alt="Option A (left), Option B (right)" data-caption="Option A (left), Option B (right)" src="https://freight.cargo.site/w/1000/i/0ef7bd8de58d6e5b0c01b30899f9e53ad11f4b3b2cc6386bd1ea92cd7d3f7ee6/CX-Website-User-Testing.png" /> Solution SEO-focused homepage and enhanced value propositionI improved SEO for the homepage by relocating signup steps to the product page. To enhance Currenxie's market reputation and articulate the benefits of account opening, I added a Reason-to-Believe (RTB) section, strengthening the value proposition. <img width="1792" height="944" width_o="1792" height_o="944" data-src="https://freight.cargo.site/t/original/i/4272f1a2d673e5400e454affc07c019b1c34638088f8d1a97a31c96a18bb9e1b/Untitled-2.gif" data-mid="214759827" border="0" alt="Redesigned website focuses on simplicity, reliability, and brand loyalty" data-caption="Redesigned website focuses on simplicity, reliability, and brand loyalty" src="https://freight.cargo.site/w/1000/i/4272f1a2d673e5400e454affc07c019b1c34638088f8d1a97a31c96a18bb9e1b/Untitled-2.gif" /> Building trust and community with testimonialsAs a growing company, building trust was key for Currenxie. I prioritized reviews and testimonials above the fold, giving users access to real feedback and fostering a sense of community. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/ea6400876d94854e396e1adbf92e1dc47cbfa2bd9a46732f49dc9d31ada0ec27/CX-Website-Testimonials.png" data-mid="214759902" border="0" alt="Testimonials and reviews placed above the fold" data-caption="Testimonials and reviews placed above the fold" src="https://freight.cargo.site/w/1000/i/ea6400876d94854e396e1adbf92e1dc47cbfa2bd9a46732f49dc9d31ada0ec27/CX-Website-Testimonials.png" /> Easily accessible FAQs A clear FAQ section is added to the homepage and certain pages to provide quick answers, improving user experience by promoting easy navigation. <img width="2880" height="1620" width_o="2880" height_o="1620" data-src="https://freight.cargo.site/t/original/i/36bd001cb6d9a6b65ad3659e5783b71f9f58430f779af1fd26d1c5ac8111b28b/CX-Website-FAQ-2.png" data-mid="214759903" border="0" alt="Part of FAQs is now available on the homepage" data-caption="Part of FAQs is now available on the homepage" src="https://freight.cargo.site/w/1000/i/36bd001cb6d9a6b65ad3659e5783b71f9f58430f779af1fd26d1c5ac8111b28b/CX-Website-FAQ-2.png" /> https://victorchien.com/Manual Tue, 16 Jul 2024 16:19:17 +0000 Victor Chien https://victorchien.com/Manual Manual Studio Reel Manual Creative is a San Francisco-based design and brand consultancy, founded by Tom Crabtree. I created a studio reel that showcases a portfolio of work done since studio’s founding in 2009, demonstrating the power of motion graphics in elevating brand identity. Role:Motion designer Contribution:Motion Graphics Team:Eileen LeeJerod RiveraTanner IrwinTom Crabtree Duration: 6 months <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/6bd1bcc33ef55bcd13c95e0fc6fd5894667bfd053fcd1ba20bc011d1b590745e/manual_16.jpg" data-mid="214759904" border="0" src="https://freight.cargo.site/w/1000/i/6bd1bcc33ef55bcd13c95e0fc6fd5894667bfd053fcd1ba20bc011d1b590745e/manual_16.jpg" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/d01932c84d9d143a815a0ec10279f67cab65dcebc903a428fedf66dca7430bb1/Manual-Studio-Reel-Cover.gif" data-mid="214759921" border="0" src="https://freight.cargo.site/w/1000/i/d01932c84d9d143a815a0ec10279f67cab65dcebc903a428fedf66dca7430bb1/Manual-Studio-Reel-Cover.gif" /> Reel Frames <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/fe9456344fe5af1b423de081d97d111713f91ef3dea583449599bb587bbca173/manual_1.jpg" data-mid="214759905" border="0" alt="YBCA" data-caption="YBCA" src="https://freight.cargo.site/w/1000/i/fe9456344fe5af1b423de081d97d111713f91ef3dea583449599bb587bbca173/manual_1.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/48d0637cbae1f3ef5f217032b82862a99ed818710b08fccbb287f5a789d54835/manual_2.jpg" data-mid="214759906" border="0" alt="San Francisco Design Week" data-caption="San Francisco Design Week" src="https://freight.cargo.site/w/1000/i/48d0637cbae1f3ef5f217032b82862a99ed818710b08fccbb287f5a789d54835/manual_2.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/9616923ab6dfe33e6a1fb3b88eb49b2ce91db1a9bada3156336377cae859caf1/manual_3.jpg" data-mid="214759907" border="0" alt="Soma Water" data-caption="Soma Water" src="https://freight.cargo.site/w/1000/i/9616923ab6dfe33e6a1fb3b88eb49b2ce91db1a9bada3156336377cae859caf1/manual_3.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/cbf97118075e3e535c9eec001a551bcb28292d8cd20aa060e6e648d0d3794f10/manual_4.jpg" data-mid="214759908" border="0" alt="WOVE" data-caption="WOVE" src="https://freight.cargo.site/w/1000/i/cbf97118075e3e535c9eec001a551bcb28292d8cd20aa060e6e648d0d3794f10/manual_4.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/95ec3cc0f33767c3c2dee44ddbd007a4341ce403f69bba15874b3646faf2c25b/manual_5.jpg" data-mid="214759909" border="0" alt="WOVE" data-caption="WOVE" src="https://freight.cargo.site/w/1000/i/95ec3cc0f33767c3c2dee44ddbd007a4341ce403f69bba15874b3646faf2c25b/manual_5.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/bb83ccf0705124290c250ff2c68bf9dfc3f71403d713c4ee567f511c88dbb255/manual_6.jpg" data-mid="214759910" border="0" alt="Pablo &amp; Rusty's" data-caption="Pablo &amp; Rusty's" src="https://freight.cargo.site/w/1000/i/bb83ccf0705124290c250ff2c68bf9dfc3f71403d713c4ee567f511c88dbb255/manual_6.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/d011db0a28d6b8971774ae946c7238d7bf23566e6b5482b6efb1e0397421e07f/manual_7.jpg" data-mid="214759911" border="0" alt="BDG architecture + design" data-caption="BDG architecture + design" src="https://freight.cargo.site/w/1000/i/d011db0a28d6b8971774ae946c7238d7bf23566e6b5482b6efb1e0397421e07f/manual_7.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/d0afdb949ea3311343d36e09697536b1cc31ccf1ce5eacba2abca435a6f45f58/manual_8.jpg" data-mid="214759912" border="0" alt="Nike Jordan" data-caption="Nike Jordan" src="https://freight.cargo.site/w/1000/i/d0afdb949ea3311343d36e09697536b1cc31ccf1ce5eacba2abca435a6f45f58/manual_8.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/f0da1519255d8737c4a0f78eaaeb25034a406a72dafe9cb2dc4fe6f49b957dca/manual_9.jpg" data-mid="214759913" border="0" alt="Fort Point Beer Company" data-caption="Fort Point Beer Company" src="https://freight.cargo.site/w/1000/i/f0da1519255d8737c4a0f78eaaeb25034a406a72dafe9cb2dc4fe6f49b957dca/manual_9.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/bdb879c0271913cfdcaad0bf1ef68b6485e765204445e943d8343eb40bce79cb/manual_10.jpg" data-mid="214759914" border="0" alt="Gap" data-caption="Gap" src="https://freight.cargo.site/w/1000/i/bdb879c0271913cfdcaad0bf1ef68b6485e765204445e943d8343eb40bce79cb/manual_10.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/f13fa142a8ce39615ef3036e649bde8effa45422e730f8b3dc59c141b0ce776a/manual_11.jpg" data-mid="214759915" border="0" alt="Nike Jordan" data-caption="Nike Jordan" src="https://freight.cargo.site/w/1000/i/f13fa142a8ce39615ef3036e649bde8effa45422e730f8b3dc59c141b0ce776a/manual_11.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/2db843a2573c29a13b71ec1ce4fa297a4bb90a8d1e20871e7846ec76486da6b9/manual_12.jpg" data-mid="214759916" border="0" alt="The Slanted Door" data-caption="The Slanted Door" src="https://freight.cargo.site/w/1000/i/2db843a2573c29a13b71ec1ce4fa297a4bb90a8d1e20871e7846ec76486da6b9/manual_12.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/1f357afc2181bf7b15d516c4d7af16914ff53681fc6e1ddfa153d0b20a60d560/manual_13.jpg" data-mid="214759917" border="0" alt="Google" data-caption="Google" src="https://freight.cargo.site/w/1000/i/1f357afc2181bf7b15d516c4d7af16914ff53681fc6e1ddfa153d0b20a60d560/manual_13.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/565c44bbb167ff473d69474e203efa4d89400156f598a3f54b439d2bb41f51cc/manual_14.jpg" data-mid="214759918" border="0" alt="Google" data-caption="Google" src="https://freight.cargo.site/w/1000/i/565c44bbb167ff473d69474e203efa4d89400156f598a3f54b439d2bb41f51cc/manual_14.jpg" /> <img width="3360" height="1886" width_o="3360" height_o="1886" data-src="https://freight.cargo.site/t/original/i/50f0044bd1f092ae133d1431a43971b83a46333f8e38ef018aef04ec8594bbfb/manual_15.jpg" data-mid="214759919" border="0" alt="Google" data-caption="Google" src="https://freight.cargo.site/w/1000/i/50f0044bd1f092ae133d1431a43971b83a46333f8e38ef018aef04ec8594bbfb/manual_15.jpg" /> An animated style guide for Wove https://victorchien.com/Bagio Tue, 16 Jul 2024 16:19:20 +0000 Victor Chien https://victorchien.com/Bagio Bagio Founded in Hong Kong in 2018, Bagio celebrates high-quality leather goods at an accessible price point. They sought a brand identity to elevate the customer experience and visually express their commitment to both minimalism and affordability. Role:Art directorDesigner Contribution:Art DirectionGraphic DesignTeam:Elaine YauDuration: 2 months <img width="1598" height="1034" width_o="1598" height_o="1034" data-src="https://freight.cargo.site/t/original/i/ea3506879dd0d00626dd2e04631e99418cfdfb1607c87177f492b1b8cbd25155/Bagio-Logo-Ani-1.gif" data-mid="214759923" border="0" src="https://freight.cargo.site/w/1000/i/ea3506879dd0d00626dd2e04631e99418cfdfb1607c87177f492b1b8cbd25155/Bagio-Logo-Ani-1.gif" /> <img width="3000" height="2250" width_o="3000" height_o="2250" data-src="https://freight.cargo.site/t/original/i/f0ddc9d60013a4aac13b36b6499990f1765c340fa90594c92edf69c93511a63c/Bagio_Business_Card_Mockup.jpg" data-mid="214759932" border="0" src="https://freight.cargo.site/w/1000/i/f0ddc9d60013a4aac13b36b6499990f1765c340fa90594c92edf69c93511a63c/Bagio_Business_Card_Mockup.jpg" /> <img width="2400" height="1600" width_o="2400" height_o="1600" data-src="https://freight.cargo.site/t/original/i/e17443d55c3abbe260777bf8e2a7e4f71894fa3cc627f45cb581ca41f6c87d4f/Bagio-Shop-Facade-Mockup-Cropped.jpg" data-mid="214759930" border="0" src="https://freight.cargo.site/w/1000/i/e17443d55c3abbe260777bf8e2a7e4f71894fa3cc627f45cb581ca41f6c87d4f/Bagio-Shop-Facade-Mockup-Cropped.jpg" /> <img width="2101" height="1501" width_o="2101" height_o="1501" data-src="https://freight.cargo.site/t/original/i/fa0db54e380a9b8e2586ec17da85300003647ed127b8325909b3cb56839dfb13/Bagio-Card-Holder-Wallet.png" data-mid="214759934" border="0" src="https://freight.cargo.site/w/1000/i/fa0db54e380a9b8e2586ec17da85300003647ed127b8325909b3cb56839dfb13/Bagio-Card-Holder-Wallet.png" /> <img width="3080" height="2200" width_o="3080" height_o="2200" data-src="https://freight.cargo.site/t/original/i/c5012629b17ddeb4ca49456e590daf407667bb53238554a583b36dcde803e2b2/Bagio-Pouch-Mockup.png" data-mid="214759933" border="0" data-rotation="0" src="https://freight.cargo.site/w/1000/i/c5012629b17ddeb4ca49456e590daf407667bb53238554a583b36dcde803e2b2/Bagio-Pouch-Mockup.png" /> <img width="1270" height="1905" width_o="1270" height_o="1905" data-src="https://freight.cargo.site/t/original/i/bb39d3fd7f0c1f78e3403106c4492116a2ab71a3568e45a96264b43c64ac3ffd/Bagio_Passport.png" data-mid="214759935" border="0" src="https://freight.cargo.site/w/1000/i/bb39d3fd7f0c1f78e3403106c4492116a2ab71a3568e45a96264b43c64ac3ffd/Bagio_Passport.png" /> <img width="1270" height="1905" width_o="1270" height_o="1905" data-src="https://freight.cargo.site/t/original/i/59361e833ee6947fcd0118476b6043eee4d900fa849562ffe44f3c85d5ca7019/Bagio_Passport2.png" data-mid="214759936" border="0" src="https://freight.cargo.site/w/1000/i/59361e833ee6947fcd0118476b6043eee4d900fa849562ffe44f3c85d5ca7019/Bagio_Passport2.png" /> Connecting customer with personalizationThe brand offers personalization across its leather products. Customers can request a monogram service upon purchase. The tag that comes with the product gives customers a sentimental value and brings the brand and customers closer. <img width="3082" height="2026" width_o="3082" height_o="2026" data-src="https://freight.cargo.site/t/original/i/7fd255d3d0ae948c0585989b1356a77dd45aaf268f6ebb5dd2bae41e25564e7e/Bagio-Label-Tag-Mockup.png" data-mid="214759929" border="0" alt="Hand-written product tag" data-caption="Hand-written product tag" src="https://freight.cargo.site/w/1000/i/7fd255d3d0ae948c0585989b1356a77dd45aaf268f6ebb5dd2bae41e25564e7e/Bagio-Label-Tag-Mockup.png" /> <img width="4604" height="3600" width_o="4604" height_o="3600" data-src="https://freight.cargo.site/t/original/i/a62722b01251930d9ac44cd57bae41bc6654061de49e29f5782a39eda25bc51b/Bagio_Wrapping-Paper3.png" data-mid="214759927" border="0" src="https://freight.cargo.site/w/1000/i/a62722b01251930d9ac44cd57bae41bc6654061de49e29f5782a39eda25bc51b/Bagio_Wrapping-Paper3.png" /> <img width="3500" height="3000" width_o="3500" height_o="3000" data-src="https://freight.cargo.site/t/original/i/376f6301c3e6adb9c8087c304618c0d7b6bb06df6e1f98a0edd3e61d341a66a1/Bagio_Bag.png" data-mid="214759938" border="0" src="https://freight.cargo.site/w/1000/i/376f6301c3e6adb9c8087c304618c0d7b6bb06df6e1f98a0edd3e61d341a66a1/Bagio_Bag.png" /> <img width="3290" height="2530" width_o="3290" height_o="2530" data-src="https://freight.cargo.site/t/original/i/8d3d2c1aa39a730d896a7a4a69d1772e5665585967abd206c09838c5c95a937b/Bagio_Packaging-Boxes2.png" data-mid="214759925" border="0" src="https://freight.cargo.site/w/1000/i/8d3d2c1aa39a730d896a7a4a69d1772e5665585967abd206c09838c5c95a937b/Bagio_Packaging-Boxes2.png" /> <img width="2500" height="1750" width_o="2500" height_o="1750" data-src="https://freight.cargo.site/t/original/i/baf0d389277738838854b6fa0a6eb41c3a4ae5fd4f9e68690e2402c8f2d3510e/Story-Mockup.png" data-mid="214759940" border="0" src="https://freight.cargo.site/w/1000/i/baf0d389277738838854b6fa0a6eb41c3a4ae5fd4f9e68690e2402c8f2d3510e/Story-Mockup.png" /> <img width="2500" height="1750" width_o="2500" height_o="1750" data-src="https://freight.cargo.site/t/original/i/a117b9e628be44b743f16792fb0e8999cc125b2e0075bf2fb9c6fbe8bb34bafa/instagram_post_mockup.png" data-mid="214759941" border="0" src="https://freight.cargo.site/w/1000/i/a117b9e628be44b743f16792fb0e8999cc125b2e0075bf2fb9c6fbe8bb34bafa/instagram_post_mockup.png" /> <img width="600" height="900" width_o="600" height_o="900" data-src="https://freight.cargo.site/t/original/i/f3e710ed7880eca1aca81d93e579715af54f443b6f8fcabc495e8fe6c448e03b/Bagio_Woman_Totebag.png" data-mid="214759937" border="0" src="https://freight.cargo.site/w/600/i/f3e710ed7880eca1aca81d93e579715af54f443b6f8fcabc495e8fe6c448e03b/Bagio_Woman_Totebag.png" /> https://victorchien.com/Archive Tue, 16 Jul 2024 16:19:22 +0000 Victor Chien https://victorchien.com/Archive Archive Previous projects, design explorations, processes, and more. Adobe CC splash screen rebrand <img width="4250" height="2417" width_o="4250" height_o="2417" data-src="https://freight.cargo.site/t/original/i/818d75024506d0683753d2fb3b5a730ed3e821765d4d43f3e4052fb6a32199ca/adobe-18-01.jpg" data-mid="214759964" border="0" src="https://freight.cargo.site/w/1000/i/818d75024506d0683753d2fb3b5a730ed3e821765d4d43f3e4052fb6a32199ca/adobe-18-01.jpg" /> <img width="4250" height="2417" width_o="4250" height_o="2417" data-src="https://freight.cargo.site/t/original/i/6d0013c440e7b1dc7c37d055c210fca1d0c8b3d8ac71a9aa3cf071bd457aa45a/adobe-13-01.jpg" data-mid="214759965" border="0" src="https://freight.cargo.site/w/1000/i/6d0013c440e7b1dc7c37d055c210fca1d0c8b3d8ac71a9aa3cf071bd457aa45a/adobe-13-01.jpg" /> <img width="4250" height="2417" width_o="4250" height_o="2417" data-src="https://freight.cargo.site/t/original/i/566464432d53d4a888fe71f646f1c7dd4855f78cdca220044398d122407000aa/adobe-14-01.jpg" data-mid="214759966" border="0" src="https://freight.cargo.site/w/1000/i/566464432d53d4a888fe71f646f1c7dd4855f78cdca220044398d122407000aa/adobe-14-01.jpg" /> <img width="4250" height="2417" width_o="4250" height_o="2417" data-src="https://freight.cargo.site/t/original/i/d3551b50d6b4dc7ab5f5e2e093cccaf085985017279db09ffaed1b628b2c1661/adobe-5-01.jpg" data-mid="214759967" border="0" src="https://freight.cargo.site/w/1000/i/d3551b50d6b4dc7ab5f5e2e093cccaf085985017279db09ffaed1b628b2c1661/adobe-5-01.jpg" /> <img width="4250" height="2417" width_o="4250" height_o="2417" data-src="https://freight.cargo.site/t/original/i/974bd33ba6c96e17b96118a4d056de27150fe04c1b7b2535950d18d9d3346376/adobe-6-01.jpg" data-mid="214759960" border="0" src="https://freight.cargo.site/w/1000/i/974bd33ba6c96e17b96118a4d056de27150fe04c1b7b2535950d18d9d3346376/adobe-6-01.jpg" /> <img width="4294" height="2800" width_o="4294" height_o="2800" data-src="https://freight.cargo.site/t/original/i/ec387c26a155c2da3335ad1c6714c114111113cf0c609228e56b5ef9aead2e00/Adobe-Title-Cards-Cargo-Cover.png" data-mid="214759959" border="0" src="https://freight.cargo.site/w/1000/i/ec387c26a155c2da3335ad1c6714c114111113cf0c609228e56b5ef9aead2e00/Adobe-Title-Cards-Cargo-Cover.png" /> Brand identity for Captain, a flight tracking app <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/8c906bd204a6ada00930382eb47f3bcaacaec158408473f7d2a8f90360012ced/Captain_Logo_Ani.gif" data-mid="214759958" border="0" src="https://freight.cargo.site/w/1000/i/8c906bd204a6ada00930382eb47f3bcaacaec158408473f7d2a8f90360012ced/Captain_Logo_Ani.gif" /> <img width="2802" height="1827" width_o="2802" height_o="1827" data-src="https://freight.cargo.site/t/original/i/f15b70feaeecd8744b47bb41dacf7970b3015e298f5d58984e46cc6fa93a6e19/Captain_Mockup_Header_Cropped.png" data-mid="214759963" border="0" src="https://freight.cargo.site/w/1000/i/f15b70feaeecd8744b47bb41dacf7970b3015e298f5d58984e46cc6fa93a6e19/Captain_Mockup_Header_Cropped.png" /> Brochure cover design for Hired Inc. <img width="3501" height="2334" width_o="3501" height_o="2334" data-src="https://freight.cargo.site/t/original/i/2edeac3dc8d8c8535b4432af15760f51003ecc5cb5301dabdf2addca17017770/crop-01.jpg" data-mid="214759943" border="0" src="https://freight.cargo.site/w/1000/i/2edeac3dc8d8c8535b4432af15760f51003ecc5cb5301dabdf2addca17017770/crop-01.jpg" /> Icon set for a San Francisco-based food delivery app <img width="8000" height="4500" width_o="8000" height_o="4500" data-src="https://freight.cargo.site/t/original/i/53aed31613b26ad3eab2e79c25f9f34d46bb36243fd0ffd652ad53f39d97a461/icons2-01.png" data-mid="214759945" border="0" src="https://freight.cargo.site/w/1000/i/53aed31613b26ad3eab2e79c25f9f34d46bb36243fd0ffd652ad53f39d97a461/icons2-01.png" /> Poster series for Don't Look Down, a subculture design exhibition <img width="5788" height="3931" width_o="5788" height_o="3931" data-src="https://freight.cargo.site/t/original/i/408c3ec94bbbbb806d028cf04540689a586abdfbef3d81d0bf65af6997810408/A3-Poster-Mockup-vol-12-new.jpg" data-mid="214759949" border="0" src="https://freight.cargo.site/w/1000/i/408c3ec94bbbbb806d028cf04540689a586abdfbef3d81d0bf65af6997810408/A3-Poster-Mockup-vol-12-new.jpg" /> <img width="3450" height="2380" width_o="3450" height_o="2380" data-src="https://freight.cargo.site/t/original/i/a10f474898200ee92983ec7a45a173e58982695cd987a58d72ece3ad5db30571/Paper-Brand-Mock-Up-Vol-11-new.jpg" data-mid="214759951" border="0" src="https://freight.cargo.site/w/1000/i/a10f474898200ee92983ec7a45a173e58982695cd987a58d72ece3ad5db30571/Paper-Brand-Mock-Up-Vol-11-new.jpg" /> <img width="4220" height="2728" width_o="4220" height_o="2728" data-src="https://freight.cargo.site/t/original/i/73311ca9a749c9183eb92080365880a94f204f55db003742b75886e1679d6f26/social-ig-post.jpg" data-mid="214759952" border="0" src="https://freight.cargo.site/w/1000/i/73311ca9a749c9183eb92080365880a94f204f55db003742b75886e1679d6f26/social-ig-post.jpg" /> Proposed brand identity for Pandora, a subscription-based music streaming service <img width="8000" height="4500" width_o="8000" height_o="4500" data-src="https://freight.cargo.site/t/original/i/703763ae5814c7d4c86967ddf4205a57fe391677d9e0f29e29bf1cf9e8b75246/pandora-02.jpg" data-mid="214759946" border="0" src="https://freight.cargo.site/w/1000/i/703763ae5814c7d4c86967ddf4205a57fe391677d9e0f29e29bf1cf9e8b75246/pandora-02.jpg" /> <img width="8000" height="4885" width_o="8000" height_o="4885" data-src="https://freight.cargo.site/t/original/i/1d0836eaf77c418693cd049a0afa491ba099a6ea096fb0b0a4a84a7c980a3202/pandora-05.jpg" data-mid="214759948" border="0" src="https://freight.cargo.site/w/1000/i/1d0836eaf77c418693cd049a0afa491ba099a6ea096fb0b0a4a84a7c980a3202/pandora-05.jpg" /> Poster series for Rather Individual, a design exhibition <img width="1549" height="1063" width_o="1549" height_o="1063" data-src="https://freight.cargo.site/t/original/i/8cd6322fe71330e33c8e3614f1dc1553d6829dc23673c1365bc32d79103e9567/NAXMV-Poster-Gravity-2.jpg" data-mid="214759955" border="0" src="https://freight.cargo.site/w/1000/i/8cd6322fe71330e33c8e3614f1dc1553d6829dc23673c1365bc32d79103e9567/NAXMV-Poster-Gravity-2.jpg" /> <img width="2703" height="1873" width_o="2703" height_o="1873" data-src="https://freight.cargo.site/t/original/i/eaa10f1502a569663e425ea2c81096c4659290d5e3891603904de5f74aedc6e5/Paper-Brand-Mock-Up-Vol-11.jpg" data-mid="214759956" border="0" src="https://freight.cargo.site/w/1000/i/eaa10f1502a569663e425ea2c81096c4659290d5e3891603904de5f74aedc6e5/Paper-Brand-Mock-Up-Vol-11.jpg" /> <img width="3024" height="4032" width_o="3024" height_o="4032" data-src="https://freight.cargo.site/t/original/i/69993e2cdbc7e5d2b036868f93ac6c34465255ad96eb0188229ce3ff019b99f1/IMG_5815.jpg" data-mid="214759953" border="0" src="https://freight.cargo.site/w/1000/i/69993e2cdbc7e5d2b036868f93ac6c34465255ad96eb0188229ce3ff019b99f1/IMG_5815.jpg" /> <img width="3024" height="3335" width_o="3024" height_o="3335" data-src="https://freight.cargo.site/t/original/i/579ba4055e4decf7b3c025399ddf0767f04b441cd906db32b42608d0058b0d23/IMG_5798-copy.jpg" data-mid="214759954" border="0" src="https://freight.cargo.site/w/1000/i/579ba4055e4decf7b3c025399ddf0767f04b441cd906db32b42608d0058b0d23/IMG_5798-copy.jpg" /> Title design for Adobe's blog <img width="8000" height="4500" width_o="8000" height_o="4500" data-src="https://freight.cargo.site/t/original/i/7271212a2bf111edf651d4da935aaaa230b2849e06246899e271c24c8d2eb0d5/GoldRush_cropped-01.jpg" data-mid="214759961" border="0" src="https://freight.cargo.site/w/1000/i/7271212a2bf111edf651d4da935aaaa230b2849e06246899e271c24c8d2eb0d5/GoldRush_cropped-01.jpg" />