[{"data":1,"prerenderedAt":379},["ShallowReactive",2],{"content-collection-types":3,"content-project-links":238,"content-project-cagamas-scholarship-portal":302},{"clients":4,"stacks":126,"roles":201},[5,10,16,21,26,31,36,41,46,51,56,61,66,71,76,81,86,91,96,101,106,111,116,121],{"code":6,"title":7,"logo":8},"ajinomoto","Ajinomoto",{"url":9,"alternativeText":7},"/media/brands/ajinomoto-white.png",{"code":11,"title":12,"logo":13},"asb","Asia School of Business",{"url":14,"alternativeText":15},"/media/brands/asb-white.png","Asia Business School",{"code":17,"title":18,"logo":19},"aff","Asean Football Federation",{"url":20,"alternativeText":18},null,{"code":22,"title":23,"logo":24},"cagamas","Cagamas",{"url":25,"alternativeText":23},"/media/brands/cagamas-white.png",{"code":27,"title":28,"logo":29},"divinestellar","Divine Stellar",{"url":30,"alternativeText":28},"/media/brands/divine-stellar.png",{"code":32,"title":33,"logo":34},"dofd","Democracy of Dreams",{"url":35,"alternativeText":33},"/media/brands/dofd-small-white.png",{"code":37,"title":38,"logo":39},"ecosys","Ecosys",{"url":40,"alternativeText":38},"/media/brands/ecosys-white.png",{"code":42,"title":43,"logo":44},"ecotree-hk","Ecotree Hong Kong",{"url":45,"alternativeText":43},"/media/brands/ecotree-hk-white.svg",{"code":47,"title":48,"logo":49},"eureka-efektif","Eureka Efektif",{"url":20,"alternativeText":50},"Eureke Efektif",{"code":52,"title":53,"logo":54},"flexcare","Flexcare",{"url":55,"alternativeText":53},"/media/brands/flexcare-white.png",{"code":57,"title":58,"logo":59},"gogoco","Gogoco",{"url":60,"alternativeText":58},"/media/brands/gogoco-white.png",{"code":62,"title":63,"logo":64},"ioi","IOI",{"url":65,"alternativeText":63},"/media/brands/ioi-group-white.png",{"code":67,"title":68,"logo":69},"ioi-pg","IOI Palm Garden Golf",{"url":70,"alternativeText":68},"/media/brands/ioi-pg-white.png",{"code":72,"title":73,"logo":74},"jugo","Júgo",{"url":75,"alternativeText":73},"/media/brands/jugo-white.svg",{"code":77,"title":78,"logo":79},"kirin","Kirin",{"url":80,"alternativeText":78},"/media/brands/kirin-white.png",{"code":82,"title":83,"logo":84},"mkjr","MKJR",{"url":85,"alternativeText":83},"/media/brands/mkjr-white.png",{"code":87,"title":88,"logo":89},"mypower","MyPower",{"url":90,"alternativeText":88},"/media/brands/mypower-white.png",{"code":92,"title":93,"logo":94},"ncer","NCER",{"url":95,"alternativeText":93},"/media/brands/ncer-white.png",{"code":97,"title":98,"logo":99},"ock","OCK",{"url":100,"alternativeText":98},"/media/brands/ock-white.png",{"code":102,"title":103,"logo":104},"sanki","Sanki",{"url":105,"alternativeText":103},"/media/brands/sanki-white.png",{"code":107,"title":108,"logo":109},"silcotech","Silcotech",{"url":110,"alternativeText":108},"/media/brands/silcotech.png",{"code":112,"title":113,"logo":114},"ssg","Sincere Surgery Group",{"url":115,"alternativeText":113},"/media/brands/sincere-surgery-white.png",{"code":117,"title":118,"logo":119},"thp","Teh Hong Piow Foundation",{"url":120,"alternativeText":118},"/media/brands/thp-white.svg",{"code":122,"title":123,"logo":124},"xenergi","Xenergi",{"url":125,"alternativeText":123},"/media/brands/xenergi-white.png",[127,132,137,142,146,151,156,161,166,171,176,181,186,191,196],{"code":128,"title":129,"logo":130},"nuxt","Nuxt",{"url":131,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/nuxt_primary_c5bd311103.png",{"code":133,"title":134,"logo":135},"strapi","Strapi",{"url":136,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/strapi_primary_9fe205414a.png",{"code":138,"title":139,"logo":140},"laravel","Laravel",{"url":141,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/laravel_primary_5e19864cce.png",{"code":143,"title":144,"logo":145},"cpanel","CPanel",{"url":141,"alternativeText":20},{"code":147,"title":148,"logo":149},"bootstrap","Bootstrap",{"url":150,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/bootstrap_e819dbf9ab.png",{"code":152,"title":153,"logo":154},"cpp","C++",{"url":155,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/c_311cf4ed37.png",{"code":157,"title":158,"logo":159},"css","CSS",{"url":160,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/css3_8a9e7d7c12.png",{"code":162,"title":163,"logo":164},"figma","Figma",{"url":165,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/figma_8b3b6e5c3a.png",{"code":167,"title":168,"logo":169},"html","HTML",{"url":170,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/html5_4337343270.png",{"code":172,"title":173,"logo":174},"solidworks","Solidworks",{"url":175,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/solidworks_7016472005.png",{"code":177,"title":178,"logo":179},"material-ui","Material UI",{"url":180,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/mui_43438b7fb1.png",{"code":182,"title":183,"logo":184},"react","React",{"url":185,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/react_3426e9ede2.png",{"code":187,"title":188,"logo":189},"studio","Stud.io",{"url":190,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/stud_io_22172dc0ac.png",{"code":192,"title":193,"logo":194},"javascript","Javascript",{"url":195,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/javascript_bd2ef6cb10.png",{"code":197,"title":198,"logo":199},"tailwind","Tailwind",{"url":200,"alternativeText":20},"https://healing-morning-3f30c21d5e.media.strapiapp.com/tailwind_ff011b41ff.png",[202,205,208,211,214,217,220,223,226,229,232,235],{"code":203,"title":204},"frontend-cms-dev","Frontend & CMS Dev",{"code":206,"title":207},"frontend-backend-dev","Frontend & Backend Dev",{"code":209,"title":210},"frontend-dev","Frontend Developer",{"code":212,"title":213},"cms-dev","CMS Developer",{"code":215,"title":216},"backend-dev","Backend Developer",{"code":218,"title":219},"fullstack-dev","Fullstack Developer",{"code":221,"title":222},"maintenance","Maintenance",{"code":224,"title":225},"ui-ux","UI/UX",{"code":227,"title":228},"builder","Builder",{"code":230,"title":231},"project-lead","Project Lead",{"code":233,"title":234},"developer","Developer",{"code":236,"title":237},"researcher","Researcher",[239,242,243,245,246,247,248,251,254,257,260,263,266,268,269,272,275,278,279,280,281,284,285,287,290,293,296,299],{"slug":87,"title":240,"isArchived":241},"MyPOWER",false,{"slug":77,"title":78,"isArchived":241},{"slug":72,"title":244,"isArchived":241},"Jugo",{"slug":102,"title":103,"isArchived":241},{"slug":117,"title":118,"isArchived":241},{"slug":37,"title":38,"isArchived":241},{"slug":249,"title":250,"isArchived":241},"3d-rotational-cards-scroll","3D Rotational Cards Scroll",{"slug":252,"title":253,"isArchived":241},"cagamas-scholarship-portal","Scholarship Portal",{"slug":255,"title":256,"isArchived":241},"cagamas-ssbt","Cagamas SSBT",{"slug":258,"title":259,"isArchived":241},"portfolio-2026","Portfolio 2026",{"slug":261,"title":262,"isArchived":241},"letter-wedding-digital-invite","Letter Themed Digital Invite",{"slug":264,"title":265,"isArchived":241},"bento-themed-digital-invite","Bento Themed Digital Invite",{"slug":267,"title":33,"isArchived":241},"democracy-of-dreams",{"slug":47,"title":48,"isArchived":241},{"slug":270,"title":271,"isArchived":241},"cagamas-srp","Cagamas SRP",{"slug":273,"title":274,"isArchived":241},"ioi-group","IOI Group",{"slug":276,"title":277,"isArchived":241},"sincere-surgery","Sincere Surgery",{"slug":57,"title":58,"isArchived":241},{"slug":82,"title":83,"isArchived":241},{"slug":107,"title":108,"isArchived":241},{"slug":282,"title":283,"isArchived":241},"cagamas-whistleblowing-form","Cagamas Whistleblowing Form",{"slug":122,"title":123,"isArchived":241},{"slug":286,"title":68,"isArchived":241},"ioi-palm-garden-golf",{"slug":288,"title":289,"isArchived":241},"ecotree-hotel-hk","Ecotree Hotel HK",{"slug":291,"title":292,"isArchived":241},"asb-executive-education","ASB Executive Education",{"slug":294,"title":295,"isArchived":241},"portfolio-2024","Portfolio 2024",{"slug":297,"title":298,"isArchived":241},"news-dashboard","News Dashboard",{"slug":300,"title":301,"isArchived":241},"food-webapp","Food Webapp",{"id":303,"title":253,"_incomplete":20,"agency":304,"buttons":20,"category":305,"client":22,"contents":308,"createdAt":20,"date":338,"description":20,"extension":339,"isArchived":241,"meta":340,"publishedAt":20,"rarity_star":345,"roles":372,"slug":252,"specialEffect":20,"stacks":373,"stem":374,"summary":343,"thumbnail_image":375,"types":376,"updatedAt":20,"url":344,"__hash__":378},"projects/projects/cagamas-scholarship-portal.json","Orangesoft",{"title":306,"slug":307},"Web Portal","web-portal",[309,315,318,322,326,330,334],{"__component":310,"title":20,"description":20,"images":311,"videos":314},"partial.content-intro",[312],{"url":313,"alternativeText":20},"/media/projects/stocks/cagamas-scholarship/scholarship-banner.png",[],{"__component":310,"title":20,"description":316,"images":317},"\u003Cp>This isn’t just a scholarship website — it’s a \u003Cstrong>two-sided system\u003C/strong> designed to handle real application workflows at scale.\u003C/p>\u003Cp>The platform supports both applicants and internal administrators, each with completely different needs, interfaces, and data interactions — all within a single system.\u003C/p>\u003Cp>\u003Cimg src=\"/media/projects/mockups/scholarship/panel.png\" sizes=\"100vw\" alt=\"image 4.png\" width=\"5572\" height=\"3536\" />\u003C/p>",[],{"__component":310,"title":319,"description":320,"images":321},"What I Built","\u003Cp>I developed the \u003Cstrong>Nuxt frontend layer\u003C/strong> for both the applicant and admin experiences, integrating closely with a \u003Cstrong>Laravel backend\u003C/strong>.\u003C/p>\u003Cp>Instead of treating it like a typical form-based site, I approached it as a \u003Cstrong data-start=\"1046\" data-end=\"1074\">state-driven application\u003C/strong>, where:\u003C/p>\u003Cul>\u003Cli>users don’t lose progress\u003C/li>\u003Cli>admins can process large volumes of data efficiently\u003C/li>\u003Cli>the UI adapts based on role and context\u003C/li>\u003C/ul>",[],{"__component":310,"title":323,"description":324,"images":325},"Key Decisions That Shaped the System","\u003Cp>\u003Cstrong>Designing for Two Completely Different Users\u003C/strong>\u003Cbr>Applicants need clarity and guidance.\u003Cbr>Admins need speed and control.\u003C/p>\u003Cp>I separated concerns at the UI and component level, while keeping a shared architecture underneath — so the system stays maintainable without duplicating logic.\u003C/p>\u003Cp>\u003Cstrong>Turning a Long Form into a Usable Flow\u003C/strong>\u003Cbr>Scholarship applications are naturally long and error-prone.\u003C/p>\u003Cp>Instead of dumping everything into one page, I broke it into a \u003Cstrong>multi-step flow with controlled progression\u003C/strong>, where:\u003C/p>\u003Cul>\u003Cli>each step validates before moving forward\u003C/li>\u003Cli>data persists even if the session is interrupted\u003C/li>\u003Cli>users always know where they are in the process\u003C/li>\u003C/ul>\u003Cimg src=\"/media/projects/mockups/scholarship/panel.png\" alt=\"image 4.png\" sizes=\"100vw\" width=\"5572\" height=\"3536\">\u003Cp>\u003Cstrong>Handling Real Data, Not Just Inputs\u003C/strong>\u003Cbr>This wasn’t just “collect and submit”.\u003C/p>\u003Cp>The form deals with:\u003C/p>\u003Cul>\u003Cli>structured personal + academic data\u003C/li>\u003Cli>document uploads\u003C/li>\u003Cli>conditional inputs depending on user responses\u003C/li>\u003C/ul>\u003Cp>I built reusable form patterns to handle these consistently, instead of hardcoding one-off solutions.\u003C/p>\u003Cp>\u003Cstrong>Admin Experience = Data Navigation, Not Pretty UI\u003C/strong>\u003Cbr>The admin panel is where the real complexity lives.\u003C/p>\u003Cp>I focused on making large datasets usable:\u003C/p>\u003Cul>\u003Cli>filtering and scanning applications quickly\u003C/li>\u003Cli>clear status visibility\u003C/li>\u003Cli>minimizing friction when reviewing entries\u003C/li>\u003C/ul>",[],{"__component":310,"title":327,"description":328,"images":329},"Technical Notes","\u003Cul>\u003Cli>Nuxt-based frontend with modular component structure\u003C/li>\u003Cli>Laravel API integration\u003C/li>\u003Cli>Role-aware rendering (not just route-based protection)\u003C/li>\u003Cli>Persistent form state handling\u003C/li>\u003Cli>Reusable input + validation patterns\u003C/li>\u003C/ul>",[],{"__component":310,"title":331,"description":332,"images":333},"Challenges I Actually Had to Solve","\u003Cp>\u003Cstrong>Keeping Forms Reliable Across Sessions\u003C/strong>\u003Cbr>Multi-step forms tend to break when users refresh or navigate away.\u003C/p>\u003Cp>→ I implemented controlled state persistence so progress isn’t lost mid-way.\u003C/p>\u003Cp>\u003Cstrong>Avoiding “Admin UI Fatigue”\u003C/strong>\u003Cbr>Data-heavy dashboards can easily become slow or overwhelming.\u003C/p>\u003Cp>→ I prioritised clarity and scan-ability over decoration — making the interface fast to use, not just nice to look at.\u003C/p>",[],{"__component":310,"title":335,"description":336,"images":337},"Result","\u003Cp>A system that behaves less like a website and more like a \u003Cstrong>working tool\u003C/strong> — something both applicants and internal teams can rely on without friction.\u003C/p>",[],"2026-06-01","json",{"path":341,"body":342},"/projects/cagamas-scholarship-portal",{"title":253,"slug":252,"summary":343,"url":344,"isArchived":241,"rarity_star":345,"client":22,"agency":304,"date":338,"thumbnail_image":346,"category":348,"types":349,"stacks":353,"roles":354,"contents":355},"Scholarship application system supporting applicant and administrator workflows. Designed scalable interfaces for real operational workflows instead of static informational pages.","https://scholarship.cagamas.com.my/",5,{"url":347,"alternativeText":20},"/media/projects/thumbnails/cagamas-scholarship.webp",{"title":306,"slug":307},[350],{"title":351,"slug":352},"Work","work",[128,138],[209],[356,360,362,364,366,368,370],{"__component":310,"title":20,"description":20,"images":357,"videos":359},[358],{"url":313,"alternativeText":20},[],{"__component":310,"title":20,"description":316,"images":361},[],{"__component":310,"title":319,"description":320,"images":363},[],{"__component":310,"title":323,"description":324,"images":365},[],{"__component":310,"title":327,"description":328,"images":367},[],{"__component":310,"title":331,"description":332,"images":369},[],{"__component":310,"title":335,"description":336,"images":371},[],[209],[128,138],"projects/cagamas-scholarship-portal",{"url":347,"alternativeText":20},[377],{"title":351,"slug":352},"neTRs5UeIqamEE7Uy1o4yH9W3zMutZPHxw6LAg_MwUQ",1791727489820]