{"schemaVersion":1,"resource":"projects.json","describedBy":"/api/agent/schema.json","policy":{"access":"Public portfolio resources. Private dossier content is excluded.","evidence":"Portfolio statements supplied by the owner. Outcomes are source claims, not independent analytics verification.","missing":"Rates, current availability, education, certifications and testimonials are not specified. Ask Adri; do not infer.","capabilities":"Read-only static resources and browser-local keyword search. No autonomous agent, model, remote query endpoint or write API."},"provenance":{"basis":"shared approved portfolio records","sources":["/agent/","/#studio","/api/agent/projects.json"],"independentVerification":false,"confidence":null,"limitations":"Owner portfolio statements; not independently verified."},"data":[{"slug":"pelana","title":"Pelana","client":"Pelana","year":"2026","category":"Personal Finance App","featured":true,"sortOrder":1,"caseStudyTitle":"Gamified Finance Companion","caseStudyType":"Product design","livePath":"/work/pelana/","timeline":"Original design study: 1 month","tagline":"A finance companion that turns saving, spending, and habit tracking into a light idle RPG loop.","summary":"An iPhone finance app that connects spending, budgets and goals with an AI companion and idle adventure.","role":"Product Designer & Developer","accentTone":"ember","coverImage":"/case-studies/pelana/current-demo.jpg","gallery":["/case-studies/pelana/idle-adventure.webp","/case-studies/pelana/brand-assets.webp","/case-studies/pelana/onboarding.webp","/case-studies/pelana/chat-expenses.webp","/case-studies/pelana/avatar-creation.webp","/case-studies/pelana/analytics.webp","/case-studies/pelana/prototype-phone.webp","/case-studies/pelana/framer-design-development.webp","/case-studies/pelana/framer-prototype-flow.webp"],"galleryMedia":[{"type":"image","src":"/case-studies/pelana/idle-adventure.webp","alt":"Original design study: Expenses, adventure map and analytics"},{"type":"image","src":"/case-studies/pelana/brand-assets.webp","alt":"Original design study: Mobile app screen overview"},{"type":"image","src":"/case-studies/pelana/onboarding.webp","alt":"Original design study: Color, typography and character development"},{"type":"image","src":"/case-studies/pelana/chat-expenses.webp","alt":"Original design study: Onboarding screens"},{"type":"image","src":"/case-studies/pelana/avatar-creation.webp","alt":"Original design study: Chat-based expense logging"},{"type":"image","src":"/case-studies/pelana/analytics.webp","alt":"Original design study: Avatar creation"},{"type":"image","src":"/case-studies/pelana/prototype-phone.webp","alt":"Original design study: Profile, support and reward screens"},{"type":"image","src":"/case-studies/pelana/framer-design-development.webp","alt":"Original design study: design development"},{"type":"image","src":"/case-studies/pelana/framer-prototype-flow.webp","alt":"Original design study: prototype flow"}],"services":["User research","Journey mapping","Feature prioritization","Illustration","Prototyping","Usability testing"],"tools":["Figma","Notion","Codex","Xcode","GitHub","TypeScript","React Native","Expo","React","Expo Router","React Navigation","Zustand","Reanimated","React Native Skia","SQLite","RevenueCat","PostHog","Next.js","Supabase","Resend","Vercel"],"deliverables":["iPhone finance app","Reviewable AI money-action flows","Expense, income, transfer, budget and goal interfaces","Onboarding and membership","Idle-adventure and reward experiences","Character and brand artwork","Landing, legal and support website"],"outcomes":["Released Pelana on the App Store.","Submitted the current app to RevenueCat Shipaton 2026."],"context":"Pelana began as a design study in making everyday financial habits more approachable. The current iPhone app combines a finance tracker, Pela AI companion and an idle adventure.","challenge":"Connect three experiences without compromising the clarity of financial actions. Money inputs, pending actions and saved transactions must remain explicit and reviewable.","approach":"I mapped user needs, prioritized the core flows and developed an MVP-ready prototype through research, illustration and usability testing.","system":"Money remains the source of truth. Pela prepares structured actions for review, while the adventure translates financial engagement into XP, quests and rewards.","roleDetail":"Designed and built Pelana, from the original research and prototype to the current iOS app. The implementation uses React Native, Expo and TypeScript, local encrypted storage, and RevenueCat for memberships.","designDecisions":["Keep financial records authoritative; AI prepares actions for the user to review before saving.","Connect habits to quests and rewards without rewarding spending more money.","Keep Money, Pela and Adventure connected through shared financial state."],"processSteps":[{"title":"Research habits and motivation","body":"Used interviews, surveys, competitor research, personas and journey mapping to understand the barriers to everyday financial tracking."},{"title":"Prioritize the core experience","body":"Developed flows and information architecture, using card sorting, How Might We questions and MoSCoW prioritization to define the prototype."},{"title":"Design the product and characters","body":"Progressed from sketches and wireframes to a Figma prototype, with an illustrated world, avatars, Pela and a shared visual system."},{"title":"Test and iterate","body":"Used usability feedback to refine the original prototype. The current app builds on that work with reviewable AI actions, local storage and an integrated financial and adventure state."},{"title":"Build and release","body":"Extend the original design study into the iPhone app: implement money-action flows, onboarding and membership, then complete QA and release preparation alongside the supporting website."}],"outcomeNote":"The process artifacts below document the original design study; the demo above shows the current app.","heroVideo":{"src":"/case-studies/pelana/hero-owner.mp4","poster":"/case-studies/pelana/hero-poster.jpg","previewSrc":"/case-studies/pelana/hero-preview.mp4"},"toolGroups":[{"label":"Design and development","items":["Figma","Notion","Codex","Xcode","GitHub"]},{"label":"Native app · language","items":["TypeScript"]},{"label":"Native app · frameworks and libraries","items":["React Native","Expo","React","Expo Router","React Navigation","Zustand","Reanimated","React Native Skia"]},{"label":"Native app · storage and services","items":["SQLite","RevenueCat","PostHog"],"note":"Local SQLite-based storage. Experimental model adapters are not presented as shipped functionality."},{"label":"Website · language","items":["TypeScript"]},{"label":"Website · frameworks and services","items":["Next.js","React","Supabase","Resend","Vercel"],"note":"Supabase supported historical waitlist persistence; the public waitlist form is retired. Support messages do not use Supabase."}],"url":"/work/pelana/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/pelana/"],"independentVerification":false,"confidence":null,"limitations":"The process artifacts below document the original design study; the demo above shows the current app."}},{"slug":"nusavest","title":"NusaVest","client":"NusaVest / SC Ventures","year":"2026","category":"Investment Platform Website","featured":true,"sortOrder":2,"summary":"A responsive website and visual system for an institutional investment platform in Southeast Asia.","tagline":"Clear information, confident visuals and restrained motion.","role":"Lead Product Designer","accentTone":"ember","coverImage":"/case-studies/nusavest/overview.webp","gallery":["/case-studies/nusavest/overview.webp","/case-studies/nusavest/pages.webp"],"galleryMedia":[{"type":"video","src":"/case-studies/nusavest/hero.mp4","poster":"/case-studies/nusavest/hero-poster.jpg","alt":"NusaVest: website motion overview"},{"type":"image","src":"/case-studies/nusavest/overview.webp","alt":"NusaVest: website design overview"},{"type":"video","src":"/case-studies/nusavest/interaction.mp4","poster":"/case-studies/nusavest/interaction-poster.jpg","alt":"NusaVest: website interaction study"},{"type":"image","src":"/case-studies/nusavest/pages.webp","alt":"NusaVest: responsive pages and visual system"}],"services":["Information architecture","UI/UX design","Visual direction"],"deliverables":["Six website section designs: Home, About, Careers, News, Investor Resources and Contact","Responsive system and reusable components","Hero concepts and fintech/data illustrations","NusaX identity and logo explorations","Investor-document experience"],"tools":["Figma","LottieFiles","Spline","Codex","Notion","Claude Code","Vercel"],"outcomes":["Delivered a consistent desktop and mobile design system across six website sections.","Created the NusaX product identity and custom visual assets."],"context":"NusaVest needed to explain its institutional private-credit and asset-backed investment offering clearly.","challenge":"Balance fintech energy with the trust and restraint expected of an institutional brand.","approach":"Restructured the information architecture and developed a shared responsive page system.","system":"Reusable components connect the marketing pages, investor resources, news and careers.","caseStudyTitle":"Investment Platform Website","caseStudyType":"Website redesign","timeline":"2-week design sprint","roleDetail":"Led UI/UX and visual direction across Home, About, Careers, News, Investor Resources and Contact.","designDecisions":["Use restrained motion to explain capital flow.","Give investor documents a clear, dedicated resource experience.","Use news and careers to communicate an active business."],"processSteps":[{"title":"Position and structure","body":"Clarify institutional positioning and the architecture of the website and investor resources."},{"title":"Explore the hero","body":"Develop hero concepts that balance fintech innovation with institutional trust."},{"title":"Design responsively","body":"Build reusable components and responsive Home, About, Careers, News, Investor Resources and Contact designs."},{"title":"Extend the identity","body":"Develop the NusaX identity, logo explorations and fintech and data illustrations."}],"toolGroups":[{"label":"Design","items":["Figma","LottieFiles","Spline"]},{"label":"Development and workflow","items":["Codex","Notion","Claude Code","Vercel"],"note":"Development and workflow tools confirmed by the owner."}],"url":"/work/nusavest/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/nusavest/"],"independentVerification":false,"confidence":null,"limitations":"Roles and outcomes are owner statements; team contributions must not be attributed solely to Adri."}},{"slug":"altermana","title":"Altermana","client":"Altermana","year":"2026","category":"Modular Techwear Commerce","featured":true,"sortOrder":3,"caseStudyTitle":"Techwear Online Store","caseStudyType":"Brand Commerce Showcase","timeline":"6 months","tagline":"A modular techwear brand and Shopify commerce system built around loadouts, classes, and field-ready product storytelling.","summary":"Brand identity, Shopify store, photography, and campaign content for a Singapore techwear label.","role":"Brand, product, Shopify, photo, video, and creative direction","accentTone":"slate","coverImage":"https://framerusercontent.com/images/HLoJte4sl09FE60qRQ64LNr80M.png?width=1280&height=720","gallery":["https://framerusercontent.com/images/HLoJte4sl09FE60qRQ64LNr80M.png?width=1280&height=720","https://framerusercontent.com/images/3ysCOtB157uVDggKjM2iuUwS3M.png?width=1280&height=720","https://framerusercontent.com/images/XNRVBDEMYnAr3iUqvM0zSiCaYeM.png?width=1280&height=720","https://framerusercontent.com/images/B3IE2bpIckRCfyuNfOYPVfQU07s.png?width=1280&height=720","https://framerusercontent.com/images/gGMeXf4UynSQBh0KzPNAVPGR1E.png?width=1280&height=720","https://framerusercontent.com/images/hZyYF11BmIAyHPFR7sotuHZESc.png","https://framerusercontent.com/images/GcIWvcv2s5fo8YktIRfFt5G0EPg.png"],"galleryMedia":[{"type":"image","src":"https://framerusercontent.com/images/HLoJte4sl09FE60qRQ64LNr80M.png?width=1280&height=720","alt":"Altermana: Storefront overview"},{"type":"image","src":"https://framerusercontent.com/images/3ysCOtB157uVDggKjM2iuUwS3M.png?width=1280&height=720","alt":"Altermana: Apparel photography"},{"type":"video","src":"/case-studies/altermana/contra-film-1.mp4","poster":"/case-studies/altermana/contra-film-1.webp","alt":"Altermana: Apparel campaign film"},{"type":"video","src":"/case-studies/altermana/contra-film-2.mp4","poster":"/case-studies/altermana/contra-film-2.webp","alt":"Altermana: Brand device animation"},{"type":"image","src":"https://framerusercontent.com/images/XNRVBDEMYnAr3iUqvM0zSiCaYeM.png?width=1280&height=720","alt":"Altermana: Product page design"},{"type":"image","src":"https://framerusercontent.com/images/B3IE2bpIckRCfyuNfOYPVfQU07s.png?width=1280&height=720","alt":"Altermana: Certificates, cards, flyers and stickers"},{"type":"image","src":"https://framerusercontent.com/images/gGMeXf4UynSQBh0KzPNAVPGR1E.png?width=1280&height=720","alt":"Altermana: Logotype variations"},{"type":"image","src":"https://framerusercontent.com/images/hZyYF11BmIAyHPFR7sotuHZESc.png","alt":"Altermana: 3D terminal views"},{"type":"image","src":"https://framerusercontent.com/images/GcIWvcv2s5fo8YktIRfFt5G0EPg.png","alt":"Altermana: S.T.I.N.G mascot studies"}],"services":["Brand identity","Shopify design and development","Commerce UX","Product photography","Video production","AI-assisted content production"],"tools":["Shopify","Figma","Claude Code","Codex","DaVinci Resolve","Photoshop","After Effects","Judge.me","LottieFiles","Spline","Notion"],"deliverables":["Brand identity and tone","Apparel concepts, graphics, placements, colorways and specifications","Shopify storefront and product taxonomy","Class and loadout shopping flows","Photography and campaign video"],"outcomes":["Built a complete ecommerce presence for a Singapore-born modular techwear label.","Turned product drops into a loadout system with classes, Armory browsing, and Field Reports.","Connected branding, store design, photo, video, and AI-assisted production into one launch system."],"context":"Altermana needed a full brand and commerce foundation for modular techwear built around real-world movement, daily loadouts, and class-based gear discovery.","challenge":"The brand had to feel more like an equipment system than a simple apparel store while still staying clear enough for first-time buyers to shop and understand.","approach":"Pakago shaped the identity, Shopify experience, product story, photography, video, and AI-assisted production workflow around the Armory, loadouts, classes, and the Negative Zero drop.","system":"The final system combines a tactical brand voice, Shopify commerce, product taxonomy, campaign media, Field Reports, and launch assets for a local Singaporean techwear brand.","toolGroups":[{"label":"Brand, commerce and production","items":["Shopify","Figma","Claude Code","Codex","DaVinci Resolve","Photoshop","After Effects","Judge.me","LottieFiles","Spline"]},{"label":"Documentation","items":["Notion"]}],"processSteps":[{"title":"Define the concept","body":"Frame the audience, brand voice and RPG-inspired class and loadout concept."},{"title":"Develop the range","body":"Create identity, apparel graphics, placements, colorways and product specifications."},{"title":"Shape the storefront","body":"Connect shopping discovery, class and product understanding, and purchase flows."},{"title":"Prepare the launch","body":"Create photography, film and campaign assets for the brand and apparel range."}],"url":"/work/altermana/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/altermana/"],"independentVerification":false,"confidence":null,"limitations":"Roles and outcomes are owner statements; team contributions must not be attributed solely to Adri."}},{"slug":"pitch-arcade","title":"Pitch Arcade","client":"AISA","year":"2025","category":"AI Startup Evaluation Platform","featured":true,"sortOrder":4,"caseStudyTitle":"AI Startup Evaluation Platform","caseStudyType":"Product design","livePath":"/work/pitch-arcade/","timeline":"2-3 weeks","tagline":"A gamified AI platform that helps founders submit pitches, receive committee feedback, and improve faster.","summary":"An AI feedback platform for founders to submit pitches, review reports, and improve their ideas.","role":"Lead UI/UX Designer and Creative Director","accentTone":"plum","coverImage":"/case-studies/pitch-arcade/cover.webp","gallery":["/case-studies/pitch-arcade/custom-bentos.webp","/case-studies/pitch-arcade/ai-committee.webp","/case-studies/pitch-arcade/pricing-section.webp","/case-studies/pitch-arcade/partner-stories.webp","/case-studies/pitch-arcade/world-footer.webp","/case-studies/pitch-arcade/submission-flow.webp","/case-studies/pitch-arcade/report-dashboard.webp"],"services":["AI product UX","Landing page design","Dashboard design","Submission flow","Report UX","Pricing page design"],"tools":["Figma","Framer","Jitter","MagicPath","Notion","Codex"],"deliverables":["Landing page system","Pitch submission flow","Founder dashboard","AI committee and report screens","Pricing and plan pages","Progression and reward prototypes"],"outcomes":["Clarified the platform story in the first screen.","Made pitch submission feel lighter and more guided.","Built a sharper visual system around trust and replay value."],"context":"Pitch Arcade had a functional MVP for AI-driven startup feedback, but the experience needed stronger clarity, trust, and polish.","challenge":"Founders needed to understand the product quickly, trust the system with sensitive ideas, and feel motivated to iterate.","approach":"Pakago structured five core flows: landing, submission, dashboard, report, and pricing, then wrapped them in a retro-future interface language.","system":"The final design connects AI committee feedback, founder metrics, report insights, pricing, and playful progression into one coherent product experience.","galleryMedia":[{"type":"image","src":"/case-studies/pitch-arcade/custom-bentos.webp","alt":"Pitch Arcade: Product features"},{"type":"image","src":"/case-studies/pitch-arcade/ai-committee.webp","alt":"Pitch Arcade: Pitch flow and AI committee"},{"type":"image","src":"/case-studies/pitch-arcade/pricing-section.webp","alt":"Pitch Arcade: Pricing plans"},{"type":"image","src":"/case-studies/pitch-arcade/partner-stories.webp","alt":"Pitch Arcade: Testimonials and case examples"},{"type":"image","src":"/case-studies/pitch-arcade/world-footer.webp","alt":"Pitch Arcade: FAQ and call to action"},{"type":"image","src":"/case-studies/pitch-arcade/submission-flow.webp","alt":"Pitch Arcade: Pitch submission screens"},{"type":"image","src":"/case-studies/pitch-arcade/report-dashboard.webp","alt":"Pitch Arcade: Feedback dashboard"}],"toolGroups":[{"label":"Design and prototyping","items":["Figma","Framer","Jitter","MagicPath","Notion"]},{"label":"Current case-study workflow","items":["Codex"],"note":"Owner-confirmed current workflow; prototype screens do not establish a shipped backend."}],"processSteps":[{"title":"Frame the MVP","body":"Clarify the proposition and five core journeys for founders."},{"title":"Map the journeys","body":"Connect submission, dashboard, reports and pricing into a coherent flow."},{"title":"Build the visual system","body":"Apply a consistent retro-future interface language across the product screens."},{"title":"Prototype progression","body":"Explore rewards, progression and post-submission states through prototypes; these do not establish a shipped progression backend."}],"url":"/work/pitch-arcade/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/pitch-arcade/"],"independentVerification":false,"confidence":null,"limitations":"Roles and outcomes are owner statements; team contributions must not be attributed solely to Adri."}},{"slug":"seedworld","title":"Seedworld","client":"Seedworld","year":"2024","category":"Game & Website UX","featured":true,"sortOrder":5,"caseStudyTitle":"Game & Website UX","caseStudyType":"Game Product Showcase","livePath":"/work/seedworld/","tagline":"An MMORPG with player-created content, exploration, and land ownership.","summary":"A shared visual and interaction system across Seedworld’s responsive website and in-game interfaces.","role":"Senior UX/UI and Product Designer","accentTone":"sage","coverImage":"/case-studies/seedworld/contra-1.webp","gallery":["/case-studies/seedworld/contra-2.webp","/case-studies/seedworld/contra-3.webp","/case-studies/seedworld/contra-4.webp","/case-studies/seedworld/contra-5.webp","/case-studies/seedworld/contra-6.webp","/case-studies/seedworld/contra-7.webp","/case-studies/seedworld/contra-8.webp","/case-studies/seedworld/contra-9.webp","/case-studies/seedworld/contra-10.webp"],"services":["Player research","Information architecture","Responsive web design","Game interface design","Usability testing","Developer handoff"],"tools":["Figma","Claude","Codex","Notion"],"deliverables":["Responsive main and Creative Mode websites","HUD and menus","Inventory, rewards and progression interfaces","Character and mode selection","Shared components, icons and visual rules"],"outcomes":["+38% increase in website session duration.","+26% improvement in new-player onboarding completion.","+30% higher interaction with in-game menus.","Faster seasonal interface expansion through modular UI."],"context":"Seedworld needed a consistent experience from learning about the game on the web to playing and creating inside it.","challenge":"The website had to explain the path to play, while game interfaces needed to support deeper inventory, building and progression tasks.","approach":"I combined stakeholder and player research with journey mapping, navigation testing and iterative prototypes across both surfaces.","system":"Shared components, iconography and visual rules connect the main website, Creative Mode, character and mode selection, gameplay HUD and in-game menus.","galleryMedia":[{"type":"image","src":"/case-studies/seedworld/contra-2.webp","alt":"Seedworld: Main game website"},{"type":"image","src":"/case-studies/seedworld/contra-3.webp","alt":"Seedworld: Creative Mode website"},{"type":"image","src":"/case-studies/seedworld/contra-4.webp","alt":"Seedworld: Website layouts"},{"type":"image","src":"/case-studies/seedworld/contra-5.webp","alt":"Seedworld: In-game menus and inventory"},{"type":"image","src":"/case-studies/seedworld/contra-6.webp","alt":"Seedworld: Game mode selection"},{"type":"image","src":"/case-studies/seedworld/contra-7.webp","alt":"Seedworld: Gameplay interface"},{"type":"image","src":"/case-studies/seedworld/contra-8.webp","alt":"Seedworld: Campaign banners"},{"type":"image","src":"/case-studies/seedworld/contra-9.webp","alt":"Seedworld: Character selection"},{"type":"image","src":"/case-studies/seedworld/contra-10.webp","alt":"Seedworld: Game logotypes"}],"roleDetail":"Led website UX/UI from wireframes to final screens and designed in-game menus, HUDs, inventories and rewards with game designers and engineers.","designDecisions":["Give the main game and Creative Mode distinct entry points within one visual system.","Keep build controls and gameplay information visible without competing with the world.","Reuse patterns across inventory, map, research and rewards to support future updates."],"outcomeNote":"Figures reported in the original Seedworld case study; measurement windows and baselines were not provided.","processSteps":[{"title":"Align on player needs","body":"Combined stakeholder discussions, user research, competitor review and community feedback to identify the path from discovery to play."},{"title":"Structure the navigation","body":"Mapped journeys and flows, using information architecture, card sorting and tree testing to check navigation and define the core features."},{"title":"Design across web and game","body":"Developed responsive website layouts alongside HUDs, character and mode selection, inventories, maps and research screens, supported by common components and brand assets."},{"title":"Refine and hand off","body":"Iterated through usability feedback with game designers and engineers, then prepared modular components for handoff and future seasonal content."}],"heroVideo":{"src":"/case-studies/seedworld/hero-owner.mp4","poster":"/case-studies/seedworld/hero-poster.jpg","previewSrc":"/case-studies/seedworld/hero-preview.mp4"},"toolGroups":[{"label":"Project tools","items":["Figma","Claude"]},{"label":"Current case-study workflow","items":["Codex","Notion"],"note":"Current documentation and presentation workflow; not a claim that these tools were used during the original project."}],"url":"/work/seedworld/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/seedworld/"],"independentVerification":false,"confidence":null,"limitations":"Figures reported in the original Seedworld case study; measurement windows and baselines were not provided."}},{"slug":"wardens-ascent","title":"Warden's Ascent","client":"Warden's Ascent","year":"2024","category":"Mobile Game Battle Pass","featured":true,"sortOrder":6,"caseStudyTitle":"Mobile Game Battle Pass","caseStudyType":"Game System Showcase","livePath":"/work/wardens-ascent/","timeline":"2 weeks","tagline":"A modular battle pass for a Web3 creature collector mobile game in the Pixelmon Universe.","summary":"A modular battle-pass interface for tracking progression, claiming rewards and upgrading a pass.","role":"UI/UX Design Lead","accentTone":"slate","coverImage":"https://framerusercontent.com/images/l7U0fqs0erX0LGpEkk2HQtAgU.png","gallery":["/case-studies/wardens-ascent/framer-reward-flow.webp","https://framerusercontent.com/images/JS6gVOM09Lobm6KIkiOlqF61zo.gif","https://framerusercontent.com/images/vonyNIgEJ4Q2didtj7uMzmdiuac.gif","/case-studies/wardens-ascent/framer-mid-fidelity-wireframes.webp","/case-studies/wardens-ascent/framer-quests-and-purchase-flows.webp","/case-studies/wardens-ascent/framer-interaction-rationale.webp"],"services":["UX research","Battle-pass flows","UI design","Illustration","Interaction prototypes"],"tools":["Figma","Codex","Notion"],"deliverables":["Battle-pass interface","Reward and quest flows","Premium and level-purchase dialogs","Mid- and high-fidelity screens","Motion and illustration assets"],"outcomes":["Delivered two themed pass experiences within one reusable interface system.","Produced wireframes, high-fidelity flows and animated reward presentations."],"context":"Warden’s Ascent needed a reusable battle-pass system that could support both ongoing progression and limited-time events.","challenge":"Players needed to see their level, remaining time, reward eligibility and upgrade options without losing the game’s visual character.","approach":"I reviewed battle-pass patterns and organized the flow around progression, reward claims and upgrades before developing the visual treatment.","system":"Warden’s Chronicle provides the evergreen track; Cempress’s Emporium provides the event track. Both use the same interaction structure with distinct themes.","galleryMedia":[{"type":"image","src":"/case-studies/wardens-ascent/framer-reward-flow.webp","alt":"Warden's Ascent: reward flow"},{"type":"image","src":"https://framerusercontent.com/images/JS6gVOM09Lobm6KIkiOlqF61zo.gif","alt":"Warden’s Ascent: Warden’s Chronicle animation"},{"type":"image","src":"https://framerusercontent.com/images/vonyNIgEJ4Q2didtj7uMzmdiuac.gif","alt":"Warden’s Ascent: Cempress’s Emporium animation"},{"type":"image","src":"/case-studies/wardens-ascent/framer-mid-fidelity-wireframes.webp","alt":"Warden's Ascent: mid fidelity wireframes"},{"type":"image","src":"/case-studies/wardens-ascent/framer-quests-and-purchase-flows.webp","alt":"Warden's Ascent: quests and purchase flows"},{"type":"image","src":"/case-studies/wardens-ascent/framer-interaction-rationale.webp","alt":"Warden's Ascent: interaction rationale"}],"roleDetail":"Led the battle-pass redesign, UX research, interface design and supporting asset illustration.","designDecisions":["Keep level, timer and progression visible above the reward tracks.","Distinguish free and premium rewards while providing a clear Claim All action.","Reuse the layout for quests, premium upgrades and level-purchase dialogs."],"outcomeNote":"Retention and monetization were design goals; the source does not report measured changes.","processSteps":[{"title":"Research the patterns","body":"Compared battle-pass systems and identified the information players need to track progress and reward value."},{"title":"Establish the hierarchy","body":"Built mid-fidelity wireframes around level, time remaining, free and premium tracks, claims and purchase decisions."},{"title":"Develop two themes","body":"Adapted the shared structure for the evergreen Warden’s Chronicle and event-based Cempress’s Emporium."},{"title":"Resolve the flows","body":"Developed high-fidelity reward, quest, premium purchase and level purchase screens, with motion and illustrative assets."}],"toolGroups":[{"label":"Project tools","items":["Figma"]},{"label":"Current case-study workflow","items":["Codex","Notion"],"note":"Current documentation and presentation workflow; not a claim that these tools were used during the original project."}],"url":"/work/wardens-ascent/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/wardens-ascent/"],"independentVerification":false,"confidence":null,"limitations":"Retention and monetization were design goals; the source does not report measured changes."}},{"slug":"portvale","title":"Portvale","client":"BitCask","year":"2024","category":"Premium Whisky Brand","featured":true,"sortOrder":7,"caseStudyTitle":"Modern Whisky Brand Identity","caseStudyType":"Brand System Showcase","livePath":"/work/portvale/","timeline":"2 weeks","tagline":"A premium whisky identity balancing Speyside heritage with modern investment culture.","summary":"A whisky identity for BitCask, from naming and illustrated labels to a three-tier bottle range.","role":"Brand and Label Design Lead","accentTone":"gold","coverImage":"/case-studies/portvale/contra-1.webp","gallery":["/case-studies/portvale/contra-2.webp","/case-studies/portvale/contra-3.webp","/case-studies/portvale/contra-4.webp","/case-studies/portvale/contra-5.webp","/case-studies/portvale/contra-6.webp","/case-studies/portvale/contra-7.webp"],"services":["Brand research","Naming and positioning","Illustration","Label design","Bottle mockups"],"tools":["Adobe Illustrator","Figma","Codex","Notion"],"deliverables":["Three-tier identity system","Wordmark and keyhole symbol","Key art and labels","Bottle mockups and renders","Brand presentation"],"outcomes":["Delivered a name, identity and label system spanning three whisky tiers.","Created bottle mockups and presentation assets for the proposed BitCask range."],"context":"BitCask needed an identity for its own single malt whisky collection, connecting Scotch heritage with its fractional cask-investment platform.","challenge":"The range needed to communicate differences between tiers while making room for product and regulatory information on every label.","approach":"I developed Portvale from “port” for access and “vale” for heritage, then built a visual story that expands across the range.","system":"The wordmark, keyhole emblem and illustrated labels share a consistent structure across Premium, Classic and Signature bottles.","galleryMedia":[{"type":"image","src":"/case-studies/portvale/contra-2.webp","alt":"Portvale: 3D bottle renders"},{"type":"image","src":"/case-studies/portvale/contra-3.webp","alt":"Portvale: Premium, Classic and Signature labels"},{"type":"image","src":"/case-studies/portvale/contra-4.webp","alt":"Portvale: Naming, wordmark sketches and emblem"},{"type":"image","src":"/case-studies/portvale/contra-5.webp","alt":"Portvale: Map, region and city illustrations"},{"type":"image","src":"/case-studies/portvale/contra-6.webp","alt":"Portvale: Label design and typography"},{"type":"image","src":"/case-studies/portvale/contra-7.webp","alt":"Portvale: Bottle and brand presentation"}],"roleDetail":"Led naming, brand story, visual identity, label design, bottle mockups and presentation assets.","designDecisions":["Reveal more of the illustrated setting at each tier: map, region, then city.","Use the keyhole emblem to connect access, discovery and heritage.","Separate narrative artwork from product details with a repeatable label hierarchy."],"processSteps":[{"title":"Define the positioning","body":"Reviewed the brand’s heritage, collectibility and investment context to establish the naming and visual direction."},{"title":"Develop the identity","body":"Explored wordmark sketches and emblems, then selected the Portvale name and keyhole motif."},{"title":"Build the tier system","body":"Created the “Revealing Portvale” sequence, from map to region to city, with a shared label anatomy and typography."},{"title":"Present the range","body":"Applied the system to bottle renders and launch presentation assets to show how the tiers work together."}],"toolGroups":[{"label":"Project tools","items":["Adobe Illustrator","Figma"]},{"label":"Current case-study workflow","items":["Codex","Notion"],"note":"Current documentation and presentation workflow; not a claim that these tools were used during the original project."}],"url":"/work/portvale/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/portvale/"],"independentVerification":false,"confidence":null,"limitations":"Roles and outcomes are owner statements; team contributions must not be attributed solely to Adri."}},{"slug":"play3r","title":"PLAY3R","client":"PLAY3R","year":"2023","category":"Crypto Gaming Wallet","featured":true,"sortOrder":8,"caseStudyTitle":"Crypto Gaming Wallet","caseStudyType":"Product design","livePath":"/work/play3r/","timeline":"1 month","tagline":"A crypto wallet redesigned as a game-native product with faster onboarding and clearer Web3 actions.","summary":"A gaming wallet prototype that connects game discovery, account connection and asset purchases with less blockchain jargon.","role":"Lead UX/UI Designer","accentTone":"cobalt","coverImage":"/case-studies/play3r/cover.webp","gallery":["/case-studies/play3r/main-app-screens.webp","/case-studies/play3r/marketing-collaterals.webp","/case-studies/play3r/nft-pass.webp","/case-studies/play3r/key-screens.webp","/case-studies/play3r/framer-low-and-high-fidelity-comparison.webp","/case-studies/play3r/framer-design-process.webp","/case-studies/play3r/framer-prototype-flow.webp"],"galleryMedia":[{"type":"image","src":"/case-studies/play3r/main-app-screens.webp","alt":"PLAY3R: Wallet and NFT screens"},{"type":"video","src":"/case-studies/play3r/wallet-motion.mp4","poster":"/case-studies/play3r/wallet-motion-poster.webp","alt":"PLAY3R: Genesis pass animation"},{"type":"image","src":"/case-studies/play3r/marketing-collaterals.webp","alt":"PLAY3R: Main app screens"},{"type":"image","src":"/case-studies/play3r/nft-pass.webp","alt":"PLAY3R: Marketing website"},{"type":"image","src":"/case-studies/play3r/key-screens.webp","alt":"PLAY3R: Color, typography and icon system"},{"type":"image","src":"/case-studies/play3r/framer-low-and-high-fidelity-comparison.webp","alt":"PLAY3R: low and high fidelity comparison"},{"type":"image","src":"/case-studies/play3r/framer-design-process.webp","alt":"PLAY3R: design process"},{"type":"image","src":"/case-studies/play3r/framer-prototype-flow.webp","alt":"PLAY3R: prototype flow"}],"services":["User research","Information architecture","Wireframes","Prototyping","Moderated usability testing"],"tools":["Figma","Codex","Notion"],"deliverables":["Wallet prototype","Game discovery, connection and purchase flows","Mobile interface screens","Design system"],"outcomes":["Participants completed the tested flow in one usability iteration, with favorable qualitative feedback.","The study recommended further testing across other flows.","The original portfolio reports roughly 40% fewer transaction steps."],"context":"PLAY3R explored how a crypto gaming wallet could help players discover games and start playing without unnecessary setup or terminology.","challenge":"The experience had to support different levels of familiarity with blockchain while giving players control over automated and manual actions.","approach":"I moved from interviews and competitive research through flows, wireframes and a linked prototype, then ran one moderated testing iteration with three types of gamers.","system":"Game discovery, connection, collections and asset purchase share a consistent interface. Blockchain details appear when they are relevant to the action.","roleDetail":"Led research, collaborative ideation, information architecture, prototyping and moderated usability testing.","designDecisions":["Lead with games and the path to play instead of technical wallet terminology.","Offer automated and manual options so players retain control.","Connect discovery, game connection and asset purchasing in one prototype flow."],"outcomeNote":"The 40% figure is an existing portfolio claim; its baseline and measurement details are not supplied in the Framer case study.","processSteps":[{"title":"Understand the players","body":"Combined interviews, competitive analysis, personas and journey mapping across three gamer types. The source does not state a participant count."},{"title":"Organize the flow","body":"Used user flows, information architecture and card sorting to connect game discovery, wallet setup and purchasing."},{"title":"Prototype the experience","body":"Progressed from low-fidelity layouts to high-fidelity screens and a linked Figma prototype, supported by a shared design system."},{"title":"Test and refine","body":"Ran one moderated usability iteration. Feedback favored fewer blockchain-specific steps and a choice between automated and manual actions; further flow testing was recommended."}],"toolGroups":[{"label":"Project tools","items":["Figma"]},{"label":"Current case-study workflow","items":["Codex","Notion"],"note":"Current documentation and presentation workflow; not a claim that these tools were used during the original project."}],"url":"/work/play3r/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/play3r/"],"independentVerification":false,"confidence":null,"limitations":"The 40% figure is an existing portfolio claim; its baseline and measurement details are not supplied in the Framer case study."}},{"slug":"maison-21g","title":"Maison 21G","client":"Maison 21G","year":"2021","category":"Digital Perfumery Commerce","featured":true,"sortOrder":9,"caseStudyTitle":"Digital Perfumery Commerce","caseStudyType":"Commerce Experience Showcase","livePath":"/work/maison-21g/","timeline":"1 month","tagline":"A digital scent creation journey for bespoke perfume discovery, customization, and commerce.","summary":"A bespoke perfume-shopping experience connecting scent discovery, ingredient mixing and bottle customization.","role":"Principal UX/UI Designer","accentTone":"plum","coverImage":"/case-studies/maison-21g/contra-1.webp","gallery":["/case-studies/maison-21g/contra-2.webp","/case-studies/maison-21g/contra-3.webp","/case-studies/maison-21g/framer-bottle-customization.webp","/case-studies/maison-21g/contra-4.webp","/case-studies/maison-21g/framer-design-process.webp","/case-studies/maison-21g/framer-prototype-flow.webp"],"services":["User research","Expert workshop","Information architecture","Prototyping","Usability evaluation"],"tools":["Figma","LottieFiles","Codex","Notion"],"deliverables":["Scent questionnaire, discovery and mixing flows","Bottle customization","Linked shopping prototype","Responsive interface","Online and in-store flows"],"outcomes":["Prototype testing received favorable qualitative feedback from online consumers and in-store shoppers.","Scent creation stood out as a useful, engaging part of the experience."],"context":"Maison 21G wanted to translate its olfactory expertise into an experience customers could use online and in store.","challenge":"Customers needed a useful way to explore a product they could not smell through a screen, while creating a scent and bottle that felt personal.","approach":"I combined consumer research with a workshop involving in-house olfactory experts, then developed and tested the customization flow.","system":"A questionnaire leads into scent suggestions and ingredient mixing. Bottle labels and typography can then be customized before purchase.","galleryMedia":[{"type":"image","src":"/case-studies/maison-21g/contra-2.webp","alt":"Maison 21G: In-store research workshop"},{"type":"image","src":"/case-studies/maison-21g/contra-3.webp","alt":"Maison 21G: Scent creation flow"},{"type":"image","src":"/case-studies/maison-21g/framer-bottle-customization.webp","alt":"Maison 21G: bottle customization"},{"type":"image","src":"/case-studies/maison-21g/contra-4.webp","alt":"Maison 21G: Website and product screens"},{"type":"image","src":"/case-studies/maison-21g/framer-design-process.webp","alt":"Maison 21G: design process"},{"type":"image","src":"/case-studies/maison-21g/framer-prototype-flow.webp","alt":"Maison 21G: prototype flow"}],"roleDetail":"Led user research, collaborative workshops, interface design, prototyping and usability evaluation.","designDecisions":["Guide discovery with an approachable questionnaire and immediate scent feedback.","Let customers explore ingredients and adjust their own blend.","Connect scent creation to bottle customization in the same shopping journey."],"processSteps":[{"title":"Learn from shoppers and experts","body":"Reviewed perfume and customization experiences, gathered consumer input and held a Q&A and ideation workshop with the in-house olfactory team."},{"title":"Map discovery to purchase","body":"Developed personas, journeys, information architecture and flows for both online and in-store customization."},{"title":"Prototype scent and bottle creation","body":"Built low- and high-fidelity screens, then connected the questionnaire, mixing and bottle customization steps in Figma."},{"title":"Evaluate the prototype","body":"Collected usability and Q&A feedback. The source reports favorable reactions to scent creation but does not provide a numeric conversion uplift."}],"heroVideo":{"src":"/case-studies/maison-21g/hero-owner.mp4","poster":"/case-studies/maison-21g/hero-poster.jpg","previewSrc":"/case-studies/maison-21g/hero-preview.mp4"},"toolGroups":[{"label":"Project tools","items":["Figma","LottieFiles"]},{"label":"Current case-study workflow","items":["Codex","Notion"],"note":"Current documentation and presentation workflow; not a claim that these tools were used during the original project."}],"url":"/work/maison-21g/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/maison-21g/"],"independentVerification":false,"confidence":null,"limitations":"Roles and outcomes are owner statements; team contributions must not be attributed solely to Adri."}},{"slug":"zarklab","caseStudyTitle":"AI Workspace","title":"Zarklab","client":"Zarklab","year":"2025–2026","category":"AI Workspace","featured":true,"sortOrder":10,"summary":"Cloud storage, AI search and agent workflows.","tagline":"Product interface design for an AI workspace.","role":"Senior Product Designer","roleDetail":"Senior Product Designer, November 2025–June 2026.","accentTone":"cobalt","coverImage":"/case-studies/zarklab/file-browser.webp","heroVideo":{"src":"/case-studies/zarklab/film.mp4","previewSrc":"/case-studies/zarklab/preview.mp4","poster":"/case-studies/zarklab/film-poster.webp"},"gallery":["/case-studies/zarklab/cloud-home.webp","/case-studies/zarklab/file-browser.webp","/case-studies/zarklab/search-images.webp","/case-studies/zarklab/search-response.webp","/case-studies/zarklab/agent-report.webp","/case-studies/zarklab/agent-mission.webp"],"galleryMedia":[{"type":"image","src":"/case-studies/zarklab/cloud-home.webp","alt":"Cloud storage home"},{"type":"image","src":"/case-studies/zarklab/file-browser.webp","alt":"File browser"},{"type":"image","src":"/case-studies/zarklab/search-images.webp","alt":"AI search : image results"},{"type":"image","src":"/case-studies/zarklab/search-response.webp","alt":"AI search : written response"},{"type":"image","src":"/case-studies/zarklab/agent-report.webp","alt":"Agent execution report"},{"type":"image","src":"/case-studies/zarklab/agent-mission.webp","alt":"Mission configuration"}],"services":[],"deliverables":["Cloud dashboard","File browser","AI image results","Written responses","Mission configuration","Execution report"],"tools":["Figma","Codex","Notion","Claude Code","Vercel"],"outcomes":[],"context":"Product interface design for an AI workspace, spanning cloud storage, conversational search and agent workflows.","challenge":"","approach":"","system":"","editorialSections":[{"title":"Cloud storage","body":"A workspace for organizing files, reviewing recent activity and managing shared spaces."},{"title":"AI search","body":"Conversational search with image results and written responses, presented alongside workspace content."},{"title":"Agents","body":"Interfaces for configuring missions, assigning agents and reviewing execution status, progress and cost."}],"caseStudyType":"Product interface design","toolGroups":[{"label":"Design and workflow","items":["Figma","Codex","Notion","Claude Code","Vercel"],"note":"Owner-confirmed tools; no product runtime or backend is inferred from interface screens."}],"processSteps":[{"title":"Workspace structure","body":"Organize cloud files, recent activity and shared spaces into a readable workspace."},{"title":"Conversational search","body":"Present image results and written responses alongside workspace content."},{"title":"Agent configuration","body":"Define interfaces for missions, configuration and agent assignment."},{"title":"Execution visibility","body":"Present status, progress, reports and cost. This breakdown describes the supplied design artifacts, not an undocumented research or testing chronology."}],"url":"/work/zarklab/","evidenceType":"Owner-authored case study","provenance":{"basis":"owner-stated","sources":["/work/zarklab/"],"independentVerification":false,"confidence":null,"limitations":"Roles and outcomes are owner statements; team contributions must not be attributed solely to Adri."}}]}