{"id":2087150,"url":"https://alion.io/job/nedbank-design-system-front-end-developer","title":"Design System: Front-End Developer","company":{"id":1868711,"name":"Nedbank","domain":"nedbank.co.za","url":"https://alion.io/company/nedbank-co-za","size_band":"501-1000","is_staffing_agency":false,"employer_type":"direct","is_intermediary":false,"listed_via":null,"ats_vendor":"SuccessFactors","truth_index":{"grade":"A","score":100,"open_postings":11,"ghost_share":0,"stale_share":0,"repost_share":0,"time_to_fill_p50_days":11,"computed_at":"2026-10-08T05:49:30Z"}},"role":"Frontend","role_family":"Frontend","seniority":"middle","employment_type":null,"work_mode":"on_site","remote_scope":null,"remote_scope_basis":null,"remote_working_hours":null,"hiring_geo_confidence":"structured","locations":["Johannesburg, South Africa"],"countries":["ZA"],"hiring_countries":[],"hiring_countries_total":0,"salary":null,"salary_estimate":null,"experience_years_min":3,"visa_sponsorship":false,"relocation_package":false,"has_equity":false,"technologies":[{"name":"Agile","optional":false},{"name":"Angular","optional":false},{"name":"Azure","optional":false},{"name":"Azure DevOps","optional":false},{"name":"CI/CD","optional":false},{"name":"Docker","optional":false},{"name":"Figma","optional":false},{"name":"Git","optional":false},{"name":"Model Context Protocol","optional":false},{"name":"Node JS","optional":false},{"name":"OWASP","optional":false},{"name":"React.js","optional":false},{"name":"Rollup","optional":false},{"name":"SonarQube","optional":false},{"name":"Turborepo","optional":false},{"name":"TypeScript","optional":false},{"name":"Vite","optional":false},{"name":"Vue.js","optional":false},{"name":"JavaScript","optional":true}],"status":"live","first_seen_at":"2026-10-08T12:52:41Z","employer_posted_date":"2026-10-08","last_verified_at":"2026-10-09T01:24:46Z","board_verified":true,"closed_at":null,"days_open":0,"trust":{"level":"ok","repost_count":null,"flags":[],"days_open":0},"description":"Job Classification\n148062\nJob Post End Date: 19 October 2026\nJob Family\nInformation Technology\nCareer Stream\nIt Application Development\nLeadership Pipeline\nManage Self: Technical\nAbout the Design System\nThe Design System Team delivers enterprise-ready components, design tokens, documentation, tooling, and standards that power digital experiences across Nedbank. Partnering closely with design, product, and engineering teams, we create accessible, consistent, and high-quality experiences while championing design craftsmanship and engineering excellence.\nJob Description Summary\nWe are looking for a passionate and driven Design System Engineer to help build and evolve Nedbank's enterprise design system. You will work closely with designers, engineers, and stakeholders to create reusable components across multiple frameworks and ensure alignment between design intent and implementation.\nJob Responsibilities:\nAs a Design System Engineer, you will:\nDesign, build, and maintain React, Angular, Vue, and Stencil based web components (TypeScript) with WCAG 2.2 compliance.\nDevelop and maintain design token pipelines, themes, and brand variants.\nCollaborate closely with designers using Figma Dev Mode, Code Connect, and MCP to translate design intent into accessible, high-quality components and experiences.\nDrive consistency and scalability by identifying reusable patterns and evolving them into systemised solutions.\nApply systems thinking to balance user needs, design requirements, technical constraints, and platform scalability.\nMaintain component documentation, reference applications, contribution guidelines, and adoption resources.\nBuild, package, and maintain scalable component libraries using Node.js, TypeScript, Rollup, and Vite.\nDevelop and optimise CI/CD pipelines in Azure DevOps and manage deployments using Docker and Azure.\nApply Git best practices, semantic versioning, release management, and dependency management.\nImplement automated testing, including unit, accessibility, visual regression, and end-to-end testing.\nMaintain code quality and security using SonarQube, dependency scanning, and secure coding practices.\nLeverage AI-assisted tools to improve development, testing, documentation, and engineering workflows.\nConduct code reviews, mentor team members, and contribute to a culture of engineering excellence.\nCollaborate across design, engineering, product, and stakeholder teams to drive alignment and adoption.\nTake ownership of solutions from concept through to release and continuous improvement.\nContinuously improve tooling, processes, documentation, and developer experience.\nChampion accessibility, usability, design quality, and engineering excellence across the design system ecosystem.\nContribute innovative ideas that strengthen design system practices, platform capabilities, and engineering standards.\nPeople Specification\nMinimum Experience Level\n3-5+ years of relevant front-end engineering experience, including experience building component libraries and reusable UI frameworks.\nDemonstrable experience shipping, maintaining, and evolving design systems or UI libraries in production environments.\nEssential Qualifications - NQF Level\nAdvanced Diplomas/National 1st Degrees\nMatric / Grade 12 / National Senior Certificate\nTechnical/Professional Knowledge:\nOur ideal Design System Engineer will have knowledge and experience in:\nModern front-end development using TypeScript and frameworks such as React, Angular, Vue, and Web Components.\nDesign system architecture, reusable UI patterns, component APIs, and scalable front-end development practices.\nSystems thinking and the ability to design solutions that balance consistency, flexibility, maintainability, and user experience.\nAccessibility standards and inclusive design principles, including WCAG 2.2.\nDesign tokens, theming strategies, and multi-brand implementations.\nDesign-to-code workflows, including Figma Dev Mode, Code Connect, MCP, and component-driven development.\nDesign principles including interaction design, visual hierarchy, usability, information architecture, and user-centred product development.\nTranslating design concepts into polished, production-ready experiences while maintaining quality, performance, scalability, and accessibility.\nFront-end performance optimisation, including bundle management, code splitting, lazy loading, tree shaking, and Core Web Vitals.\nNode.js tooling, modern package management, build systems, and component library distribution.\nMonorepo strategies, versioning, dependency management, and release processes using Nx, Turborepo, or similar tooling.\nAEM authoring and integration principles.\nCI/CD practices, Azure DevOps, containerisation, cloud platforms, and deployment automation.\nAutomated testing strategies, including unit, integration, accessibility, visual regression, and end-to-end testing.\nSecure coding practices, software quality standards, vulnerability management, and OWASP principles.\nStrong communication, collaboration, stakeholder engagement, ownership, and Agile delivery practices.\nA passion for design systems, digital craftsmanship, continuous improvement, and creating exceptional user and developer experiences.\nWhy Join the Design System Team?\nIf you're passionate about front-end engineering, accessibility, design systems, and digital craftsmanship, and want to help shape the standards, tools, and components that power Nedbank's digital ecosystem while driving innovation and improving developer experience at scale, we'd love to hear from you. You'll work at the intersection of design and engineering, helping teams deliver consistent, accessible, and high-quality experiences while influencing the future of design system practices, tooling, user experience, and digital craftsmanship across the organization.\n---------------------------------------------------------------------------------------\n Please contact the Nedbank Recruiting Team at +27 860 555 566","description_format":"text","description_chars":5964,"description_truncated":false,"requirements":{"experience_years_min":3,"management_years_min":null,"team_size_min":null,"manages_managers":false,"education":null,"security_clearance":false,"languages":[]},"benefits":[],"hiring_locations":[],"hiring_excludes":[],"relocation_offered":false,"industries":["Financial Services","Wealth Management & Financial Advisors","Mortgage Lending & Brokers"],"lifecycle":[{"event":"open","at":"2026-10-08T12:52:41Z"}],"visa":[],"liveness":{"score":86,"band":"hot","label":"Hiring now","p_open":1,"p_active":0.86,"p_room":1,"age_days":0,"expected_fill_days":11,"reasons":["conf:3","win:early"],"computed_at":"2026-10-09T04:51:35Z"},"pay":null,"html_url":"https://alion.io/job/nedbank-design-system-front-end-developer","json_url":"https://alion.io/job/nedbank-design-system-front-end-developer.json","meta":{"generated_at":"2026-10-09T04:51:35Z","cache_seconds":300,"methodology":"https://alion.io/methodology","terms":"https://alion.io/terms","contact":"https://alion.io/contact","api":"https://alion.io/developers","about":"Alion is a live layer of people, companies and AI agents: who they are, whether they are real and active right now, what they do and how to work with them, readable by people and by agents and paid per call.","catalog":"https://alion.io/catalog.json","usage":{"tier":"crawler","counted_by":"address","units_charged":1,"used_today":4929,"day_limit":5000,"remaining_today":71,"minute_limit":60,"resets_at":"2026-10-10T00:00:00Z"}},"offers":[{"id":"company.slices","title":"One company in depth, by slice","status":"live","price":{"credits":0.02,"usd":0.002,"plus_per_slice":{"credits":0.05,"usd":0.005}},"unit":"per company, plus each slice with data","note":"the employer in depth","call":{"mcp_tool":"get_company","arguments":{"id":1868711},"rest":"https://alion.io/mcp/rest/get_company?id=1868711"},"human":"https://alion.io/catalog?offer=company.slices&for=job%2Fnedbank-design-system-front-end-developer"},{"id":"market.stats","title":"A market slice: pay, demand and time to fill","status":"live","price":{"credits":1,"usd":0.1},"unit":"per slice","note":"pay, demand and time to fill for this role and place","call":{"mcp_tool":"market_stats"},"human":"https://alion.io/catalog?offer=market.stats&for=job%2Fnedbank-design-system-front-end-developer"},{"id":"job.search","title":"Open jobs by role, technology, place, pay and visa","status":"live","price":{"credits":0.02,"usd":0.002},"unit":"per posting in a list","note":"similar open postings","call":{"mcp_tool":"search_jobs"},"human":"https://alion.io/catalog?offer=job.search&for=job%2Fnedbank-design-system-front-end-developer"},{"id":"company.verify","title":"Is this company real and active right now","status":"pilot","price":null,"unit":"per company","request":{"url":"https://alion.io/catalog/request","method":"POST","body":"{\"offer\": \"company.verify\", \"for\": \"job/nedbank-design-system-front-end-developer\", \"note\": \"what you need it for\"}"},"human":"https://alion.io/catalog?offer=company.verify&for=job%2Fnedbank-design-system-front-end-developer"}]}