19 Sep
|
MeridianSquare
|
Goa
19 Sep
MeridianSquare
Goa
Job Description
Role Overview
n
We are hiring a full-time UI/UX Designer & Frontend Developer to own the design system and help deliver production-quality interfaces across two B2B SaaS products built on a shared modern engineering stack.
n
This is an end-to-end role:
n
User Flow → Wireframe → Figma → Design System → Reusable Components → Production Frontend
n
This is not a design-only role or a generic frontend-development role. You will design in Figma, govern a centrally managed Bootstrap theme and design-token system, and build or work directly with developers on reusable production components. Your role is to keep the designed experience and the shipped experience aligned.
n
You will be the quality bridge between design and production. Engineers should involve you before introducing custom styling, so shared interface decisions remain consistent, scalable, and maintainable.
n
What You'll Do
n
Design-System Ownership
n
n
- Own and evolve a centrally governed Bootstrap theme and design-token system across both products.
n
- Define and maintain visual foundations including colours, typography, spacing, radius, buttons, forms, tables, cards, and responsive patterns.
n
- Maintain Figma as the canonical design reference and keep it aligned with production.
n
- Build and maintain reusable Figma component libraries, variants, and responsive layouts.
n
- Extend a shared design system across products with distinct visual identities.
n
- Support configurable and white-label theming when required.
n
- Establish clear standards for shared components versus product-specific treatments.
n
- Review changes affecting shared themes, components, and styling.
n
- Prevent hardcoded visual values and unnecessary local overrides from accumulating in the product.
n
- Document design-system standards and component usage so developers can implement interfaces consistently.
n
n
The objective is simple: global design changes should be made once at the appropriate theme or token level and propagate consistently throughout the application.
n
Product Design
n
n
- Translate product requirements, business goals, and user needs into clear user flows and intuitive interfaces.
n
- Create user flows, wireframes, high-fidelity mock-ups, and interactive prototypes in Figma and FigJam.
n
- Design at the component level, not only at the screen level.
n
- Design complex B2B application workflows, including:
n
- Multi-step onboarding
n
- Dashboards
n
- Data tables
n
- Forms
n
- Search and filtering
n
- Approval queues
n
- Role-based interfaces
n
- Status management
n
- Administrative screens
n
- Define relevant UI states, including loading, empty, error, success, validation, and permission-gated states.
n
- Deliver responsive desktop, tablet, and mobile designs,
applying sound judgment to workflows that require full mobile support.
n
- Apply strong visual hierarchy, typography, colour, layout, iconography, and interaction-design principles.
n
- Ensure designs follow accessibility and inclusive-design principles.
n
- Work directly with engineers to resolve implementation constraints without compromising design-system consistency.
n
n
Frontend Implementation
n
n
- Build and modify production UI using React.
n
- Implement responsive interfaces using Bootstrap, HTML, CSS, and responsive-design frameworks.
n
- Convert approved Figma designs into reusable frontend components.
n
- Implement or pair with frontend developers on important shared components.
n
- Build reusable components rather than page-specific implementations.
n
- Make shared visual changes at the theme or token level, avoiding one-off local CSS overrides where a shared solution is appropriate.
n
- Integrate frontend components with application data and account for real interface states, not only static mock-ups.
n
- Debug responsive, browser, and layout issues.
n
- Validate implementation against approved Figma designs before release and identify discrepancies.
n
- Participate in design reviews, delivery planning, implementation reviews, and cross-functional product discussions.
n
n
Required Qualifications
n
n
- 4–7 years of professional experience spanning UI/product design and frontend implementation.
n
- A strong portfolio demonstrating web-application or product design and shipped production UI.
n
- Advanced proficiency in Figma and FigJam, including:
n
- Component libraries
n
- Auto Layout
n
- Variants
n
- Design tokens
n
- Prototyping
n
- Developer handoff
n
- Experience building and maintaining a governed design system used by multiple developers.
n
- Robust understanding of how CSS and component drift occurs, and how to prevent it structurally.
n
- Strong Bootstrap knowledge, including theme architecture and reusable component patterns.
n
- Production experience with React.
n
- Ability to open a production codebase, build or modify a component, and review another developer's implementation.
n
- Strong HTML, CSS, and responsive-layout skills.
n
- Experience designing complex B2B interfaces such as dashboards, data tables, multi-step forms, and status-driven workflows.
n
- Experience working directly with software engineers throughout implementation.
n
- Strong communication, presentation, collaboration, and problem-solving skills.
n
n
Portfolio is required. Applications without relevant web-application UI, design-system, or component-library examples will not be reviewed.
n
Preferred Qualifications
n
n
- Experience using Figma, Adobe Creative Cloud, Adobe XD, Photoshop, and Illustrator.
n
- Working knowledge of Angular or Vue.js.
n
- Experience interpreting user behaviour and product performance through Google Analytics.
n
- Experience with multi-product or white-label theming based on a shared design system.
n
- Accessibility awareness, including focus states and semantic markup.
n
- Performance-conscious frontend practices.
n
- Experience with data-intensive B2B or SaaS applications.
n
- Experience using AI-assisted design and development tools while independently reviewing and validating the output.
n
n
Core Tools and Technologies
n
n
- Adobe Creative Cloud
n
- Adobe XD
n
- Photoshop
n
- Illustrator
n
- Figma
n
- FigJam
n
- Bootstrap
n
- HTML
n
- CSS
n
- Responsive design frameworks
n
- Jira
n
- React
n
- Angular
n
- Vue.js
n
- Google Analytics
n
n
Not Required
n
This role works closely with specialized frontend and backend engineers. You are not expected to own:
n
n
- Backend development
n
- Database architecture
n
- Infrastructure
n
- Full application-state architecture
n
- Application-programming-interface architecture
n
- Domain-specific backend business logic
n
n
Your responsibility is the intersection of product-interface design, design-system governance, and production frontend implementation.
n
This Role Is Not for You If
n
Your normal approach is custom CSS per page, uncontrolled local component overrides, or handing off static Figma mock-ups without staying involved through implementation.
n
We need one governed visual system, not a new styling approach for every feature.
n
If you prefer to work exclusively in Figma and do not want to open the React codebase—or prefer frontend coding without responsibility for design-system consistency—this role is unlikely to be the right fit.
n
What Success Looks Like
n
n
- Figma and the production applications remain aligned.
n
- Developers reuse approved components rather than recreating them.
n
- Global design changes propagate through governed themes and design tokens.
n
- New workflows move efficiently from requirements to production.
n
- UI consistency improves as the applications grow.
n
- Responsive behaviour is considered during design rather than added afterward.
n
- Developers receive implementation-ready designs.
n
- The person designing the experience remains involved until that experience is successfully implemented.
n
📌 UI/UX Designer (Goa)
🏢 MeridianSquare
📍 Goa