{"product_id":"user-portal-ux-ui-system-design","title":"User Portal UX\/UI System Design","description":"\u003cp\u003e\u003cstrong\u003eService fee:\u003c\/strong\u003e RM80,000 per portal project\u003c\/p\u003e\n\u003cp\u003eEnd-to-end UX\/UI system design for an authenticated user portal, including architecture, core flows, responsive screens, reusable components and developer handoff.\u003c\/p\u003e\n\u003ch3\u003eFinal deliverable\u003c\/h3\u003e\n\u003cul\u003e\n\u003cli\u003e\n\u003cstrong\u003eFinal output:\u003c\/strong\u003e Complete portal UX\/UI system, prototypes and handoff-ready Figma library\u003c\/li\u003e\n\u003cli\u003e\n\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 3 user roles, 5 core flows and 30 unique screens\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003ch3\u003eDetailed scope of work\u003c\/h3\u003e\n\u003col\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eDiscovery Workshops\u003c\/strong\u003e\u003cbr\u003eAlign stakeholders on portal objectives, users, requirements, operational needs and technical constraints.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Discovery findings\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 3 sessions\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eStakeholder Input\u003c\/strong\u003e\u003cbr\u003eGather and synthesise requirements from priority business and operational stakeholders.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Requirement summary\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 5 stakeholders\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eUser-Role Definition\u003c\/strong\u003e\u003cbr\u003eDefine the responsibilities, permissions, information needs and priority actions of included portal users.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Role framework\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 3 primary roles\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eFeature \u0026amp; Requirement Mapping\u003c\/strong\u003e\u003cbr\u003eOrganise the approved feature set, functional requirements, dependencies and design priorities.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Feature map\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e 1 portal\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003ePortal Information Architecture\u003c\/strong\u003e\u003cbr\u003eStructure the navigation, dashboard, modules and information hierarchy.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Portal architecture\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e 1 system\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eCore User-Flow Mapping\u003c\/strong\u003e\u003cbr\u003eMap the included priority journeys and their decision, validation and completion states.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e User-flow set\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 5 core flows\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eLow-Fidelity Wireframes\u003c\/strong\u003e\u003cbr\u003eDesign the approved screen structures, interactions and responsive behaviour.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Wireframes\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 30 unique screens\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eHigh-Fidelity UI Design\u003c\/strong\u003e\u003cbr\u003eDesign the approved portal screens across desktop and mobile-responsive layouts.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Responsive UI screens\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 30 unique screens\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eDashboard \u0026amp; System-State Design\u003c\/strong\u003e\u003cbr\u003eDesign included dashboards plus empty, loading, validation, error and success states.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Dashboard and state set\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Standard states for approved screens\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003ePortal Design System\u003c\/strong\u003e\u003cbr\u003eDevelop reusable navigation, tables, cards, fields, controls, typography, colour and spacing components.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Figma component library\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e 1 portal system\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003ePriority Prototypes\u003c\/strong\u003e\u003cbr\u003eConnect selected screens to demonstrate the most important portal journeys.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Clickable prototypes\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e Up to 3 priority flows\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eConsolidated Revisions\u003c\/strong\u003e\u003cbr\u003eApply consolidated feedback within the approved requirements and screen allowance.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Approved portal designs\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e 2 wireframe rounds + 2 UI rounds\u003c\/p\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cp\u003e\u003cstrong\u003eDeveloper Handoff \u0026amp; Design QA\u003c\/strong\u003e\u003cbr\u003ePrepare the design library and review implementation against the approved interface.\u003cbr\u003e\u003cstrong\u003eOutput:\u003c\/strong\u003e Handoff package + QA log\u003cbr\u003e\u003cstrong\u003eAllowance:\u003c\/strong\u003e 1 handoff + 2 review rounds\u003c\/p\u003e\u003c\/li\u003e\n\u003c\/ol\u003e\n\u003ch3\u003eService boundary\u003c\/h3\u003e\n\u003cp\u003eDevelopment, backend logic, API and database architecture, technical specifications, copywriting, user testing and work beyond the included roles, flows or screens are separately scoped.\u003c\/p\u003e","brand":"Foxar Athon","offers":[{"title":"Default Title","offer_id":47973798609074,"sku":"WEB004","price":80000.0,"currency_code":"MYR","in_stock":true}],"url":"https:\/\/www.foxarathon.com\/products\/user-portal-ux-ui-system-design","provider":"Foxar Athon","version":"1.0","type":"link"}