UI Developer

📍 Job Overview

Job Title: UI Developer

Company: Citi

Location: Bengaluru, Karnataka, India

Job Type: FULL_TIME

Category: Technology / Frontend Development / AI User Interfaces

Date Posted: 2026-04-15

Experience Level: Mid-Senior Level (5-8 years)

Remote Status: On-site

🚀 Role Summary

• Focus on designing and engineering AI-first user interfaces, transforming complex AI capabilities into intuitive and reliable user experiences.

• Develop and deploy production-grade features that significantly enhance developer productivity and user interaction with AI applications.

• Collaborate closely with AI engineers, software engineers, and product stakeholders to integrate cutting-edge Generative AI techniques into user-facing applications.

• Elevate the quality of the React/TypeScript codebase through advanced componentization, robust testing strategies, Storybook integration, and adherence to modern architecture patterns.

• Contribute to the expansion of evaluation metrics and techniques specifically for simplifying Agentic AI development and deployment.

📝 Enhancement Note: While the core role is UI Development, the emphasis on "AI-first UX," "Generative AI," and "Agentic AI" positions this as a specialized frontend role focused on the emerging field of AI-driven user interfaces, requiring a blend of strong frontend skills and an understanding of AI application design. The "Data/Information Mgt Intmd Analyst (C11)" title suggests a role within a data analytics or decision management function, leveraging UI development skills to make data and AI insights accessible.

📈 Primary Responsibilities

• Design and engineer AI-first user experiences, including conversational/agentic flows and rich visualizations, to translate complex AI capabilities into usable and reliable interfaces.

• Ship production features that measurably improve developer productivity and user engagement with AI-powered tools.

• Collaborate with AI engineers, software engineers, and product partners to leverage the latest Generative AI techniques and apply them to user-facing applications.

• Raise the bar for the React/TypeScript codebase by focusing on componentization, comprehensive testing, Storybook adoption, and robust architecture patterns.

• Expand evaluation metrics and techniques to simplify the development and deployment of Agentic AI applications.

• Work within the TTS (Treasury and Trade Solutions) Analytics team, focusing on business problems related to client experience, acquisition, cross-sell, and revenue growth.

• Extract relevant insights from data, identify business opportunities, and convert business problems into analytical frameworks using big data tools and AI/ML techniques.

• Design, implement, and scale production-grade AI applications end-to-end, from data ingestion and model services to user-facing interfaces, observability, and secure deployments.

📝 Enhancement Note: The responsibilities highlight a dual focus: core UI development excellence and specialized application of these skills within an AI and data analytics context. The mention of "TTS Analytics team" and "Treasury & Trade Services business" provides crucial domain context for understanding the business problems the role will address.

🎓 Skills & Qualifications

Education:

Experience:

• 5–8 years of strong expertise in building modern frontend applications.

• Experience in designing and engineering AI-first UX, including conversational and agentic flows.

Required Skills:

• Proficiency in JavaScript, React (or another primary UI framework), and TypeScript.

• Experience with state management libraries such as Redux, Context API, or Zustand for building well-structured applications.

• Demonstrated experience with Storybook or other componentized development approaches.

• Proficiency in implementing streaming and real-time user experiences (e.g., word/token streaming, live updates, progress/status indicators).

• Ability to design intuitive UIs specifically for AI-first experiences (chat, streaming, agentic workflows).

• Strong understanding of frontend architecture, state management patterns, performance optimization techniques, and responsive design principles.

Preferred Skills:

• Experience with AI development frameworks like LangChain, LangGraph, Google ADK (Agent Development Kit), or Vercel AI SDK.

• Familiarity with modern frontend build tools and frameworks such as Next.js and Vite.

• Experience with internal design systems.

• Familiarity with CI/CD tools including Jenkins, Tekton, ArgoCD, or Harness.

• Experience developing evaluation metrics for Agentic AI.

• Access to and experience with AI coding assistants like GitHub Copilot and Cognition.ai's Devin.

📝 Enhancement Note: The "5-8 years" experience requirement, combined with the emphasis on influencing architecture and shipping production features, indicates a mid-to-senior level role. The inclusion of specific AI development frameworks (LangChain, etc.) as "good to have" suggests that prior experience in this niche is a strong advantage, but not strictly mandatory for candidates with exceptional core frontend skills.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Demonstrate a strong portfolio showcasing modern frontend application development, with a focus on impactful UI/UX design and robust architecture.

• Include case studies or examples of complex frontend projects, highlighting problem-solving approaches and technical decision-making.

• Showcase experience with component-based development, state management solutions, and responsive design implementations.

Process Documentation:

• Be prepared to discuss your process for developing and optimizing frontend workflows, from initial design to final implementation and testing.

• Highlight experience with agile development methodologies, code reviews, and continuous integration/continuous deployment (CI/CD) practices.

• Be ready to articulate your approach to ensuring code quality, performance, and maintainability in large-scale frontend applications.

• Demonstrate an understanding of how to translate business requirements and user needs into functional and user-friendly interfaces.

📝 Enhancement Note: For a UI Developer role, particularly one touching on AI applications, a portfolio is crucial. The emphasis should be on demonstrating not just visual design skills, but also architectural soundness, proficiency with modern frameworks (React/TypeScript), and experience with complex, dynamic interfaces. For this specific role, showcasing any experience with real-time data, streaming, or AI-integrated UIs would be highly beneficial.

💵 Compensation & Benefits

Salary Range:

Given the location (Bengaluru, India), experience level (5-8 years), and the specialized nature of AI UI development within a major financial institution like Citi, a competitive salary range is expected. Based on industry benchmarks for experienced UI Developers in tech hubs like Bengaluru, and considering the C11 analyst level, the estimated annual salary range would be approximately ₹18,00,000 - ₹30,00,000 (Indian Rupees).

Benefits:

• Comprehensive health insurance coverage (medical, dental, vision).

• Retirement savings plans and employee stock purchase options.

• Paid time off, including vacation days, sick leave, and public holidays.

• Professional development opportunities, including training, certifications, and conference attendance.

• Access to employee assistance programs for well-being support.

• Potential for performance-based bonuses and annual increments.

Working Hours:

• Standard full-time workweek, typically 40 hours, with flexibility often available.

• The role is on-site, requiring adherence to office working hours, though occasional remote work might be permissible based on team and management discretion.

• Potential for occasional extended hours to meet project deadlines or support critical deployments, especially given the fast-paced nature of AI development.

📝 Enhancement Note: Salary estimation is based on data from various Indian job boards and salary aggregators for experienced UI Developers in Bengaluru, factoring in Citi's standing as a large financial institution and the specialized AI/GenAI skillset. The C11 Analyst level at Citi typically corresponds to a mid-to-senior individual contributor role. Benefits are typical for large multinational corporations in the tech and finance sectors.

🎯 Team & Company Context

🏢 Company Culture

Industry: Financial Services / Technology. Citi operates globally within the financial services sector, with a significant focus on leveraging technology to drive innovation and client solutions. The TTS (Treasury and Trade Solutions) division specifically focuses on providing a suite of cash management, payments, and trade finance services to corporations worldwide.

Company Size: Citi is a very large multinational corporation, employing over 200,000 people globally. This scale offers immense stability, resources, and opportunities for career growth and diverse project exposure.

Founded: 1812. Citi has a long and rich history, evolving from its origins as the City Bank of New York. This longevity signifies stability, deep industry expertise, and a forward-thinking approach to adapting to market changes.

Team Structure:

• The TTS Analytics team is part of a larger Decision Management and Data/Information Management group within Citi.

• The team likely comprises data scientists, AI engineers, data analysts, and specialized UI developers like this role, all collaborating to drive business outcomes.

Methodology:

• Data-Driven Decision Making: The team's core function is to extract insights from data to inform business strategy.

• AI/ML Integration: Utilizing advanced techniques, including Generative AI and deep learning, to solve complex business problems.

• Collaboration: Working closely with business, product, and engineering partners to ensure analytical frameworks and AI solutions are aligned with business needs and deliver tangible outcomes.

• Agile Development: Employing agile methodologies for iterative development, testing, and deployment of AI applications and features.

Company Website: https://www.citi.com/

📝 Enhancement Note: Citi's established presence in financial services combined with its investment in advanced analytics and AI indicates a culture that values both stability and innovation. The TTS Analytics team's focus on client experience and revenue growth suggests a results-oriented environment where technology plays a critical role in achieving business objectives.

📈 Career & Growth Analysis

Operations Career Level: This role is classified as a Data/Information Management Intermediate Analyst (C11). This level typically signifies a skilled individual contributor with 5-8 years of experience, capable of independent work, contributing to complex projects, and mentoring junior team members. It sits within the broader "Decision Management" and "Data/Information Management" job families, indicating a strategic focus on leveraging data and AI for business advantage.

Reporting Structure: The role reports to an AVP/VP leading the TTS Analytics team. This implies a direct line of communication with leadership and exposure to strategic decision-making processes within the analytics function. Collaboration will extend to AI engineers, software engineers, and product partners across various business units.

Operations Impact: The UI Developer in this team directly impacts the usability and effectiveness of AI-driven analytics and Generative AI solutions. By designing intuitive interfaces, this role makes complex data insights and AI capabilities accessible to business stakeholders, thereby influencing client experience, acquisition strategies, cross-sell initiatives, and overall revenue growth within the Treasury & Trade Services business. The ability to translate complex AI into user-friendly interfaces will be key to driving adoption and realizing the full business value of these advanced technologies.

Growth Opportunities:

• Technical Specialization: Deepen expertise in AI-first UI development, Generative AI interfaces, and emerging frontend technologies. Opportunities to become a subject matter expert in specific AI frameworks (LangChain, etc.) or advanced frontend patterns.

• Cross-Functional Leadership: Transition into roles that involve leading UI/UX strategy for AI initiatives, managing frontend development teams, or taking on product management responsibilities for AI applications.

• Domain Expertise: Develop a strong understanding of Treasury and Trade Services, enabling a move towards more specialized product development or business analyst roles within fintech or financial services.

• Management Track: Progress into management roles, leading teams of UI developers or contributing to broader engineering leadership within Citi's technology divisions.

• Learning & Development: Access to Citi's extensive training programs, workshops, and potential certifications in AI, data science, and advanced frontend development.

📝 Enhancement Note: The "C11" level and the specific responsibilities suggest a role with significant autonomy and potential for impact. The growth opportunities highlight a clear path for specialization in the high-demand field of AI UI development, as well as broader career progression within a large financial institution.

🌐 Work Environment

Office Type: This is an on-site role, indicating a traditional office-based work environment within Citi's Bengaluru campus. The office will likely feature modern collaborative workspaces designed to foster teamwork and innovation.

Office Location(s): Bengaluru, Karnataka, India. This location is a major technology and business hub, providing access to talent, infrastructure, and a vibrant professional community.

Workspace Context:

• Collaborative Environment: Expect a dynamic workspace designed to encourage interaction and collaboration with AI engineers, software engineers, product managers, and data analysts.

• Technology Access: Access to cutting-edge development tools, high-performance computing resources, and potentially AI-assisted coding tools (like GitHub Copilot) to enhance productivity.

• Team Interaction: Regular team meetings, brainstorming sessions, and cross-functional discussions will be a part of the daily routine, facilitating knowledge sharing and problem-solving.

Work Schedule: The role is full-time, likely adhering to standard business hours in India (Asia/Kolkata timezone). While on-site, there may be some flexibility in daily start/end times, but the core expectation is presence during business hours for collaboration and project execution. Some project-driven needs might require occasional extended hours.

📝 Enhancement Note: An on-site role within a large corporation like Citi suggests a structured yet collaborative environment. The focus on AI and analytics implies a modern tech setup within the office space.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: HR or recruiter call to assess basic qualifications, interest, and cultural fit.

• Technical Assessment: This may involve coding challenges (e.g., live coding exercises on platforms like HackerRank or LeetCode), a take-home project, or in-depth technical discussions focused on React, TypeScript, state management, and UI architecture.

• Portfolio Review: A dedicated session where candidates present their portfolio, discussing specific projects, technical challenges, design decisions, and outcomes. Emphasis will be placed on demonstrating their ability to build robust, scalable, and user-friendly interfaces, especially those involving complex data or AI integrations.

• Behavioral & Situational Interviews: Questions designed to assess problem-solving skills, collaboration style, adaptability, and alignment with Citi's values. Expect questions related to handling challenging projects, working with diverse teams, and driving innovation.

• Hiring Manager/Team Lead Interview: Final discussion to assess overall fit, strategic thinking, and alignment with the team's goals and the company's direction.

Portfolio Review Tips:

• Curate Select Projects: Choose 3-4 of your strongest projects that best showcase your expertise in React, TypeScript, UI architecture, and ideally, any experience with real-time data, streaming, or AI-assisted development.

• Focus on Impact: For each project, clearly articulate the business problem, your role, the technical solutions implemented, the challenges faced, and the measurable outcomes or impact achieved. Use metrics where possible.

• Technical Depth: Be prepared to dive deep into the technical details of your implementations – state management choices, component design, performance optimizations, testing strategies, and architectural decisions.

• AI/Generative AI Relevance: If you have any projects involving AI, ML, chatbots, or data visualization of complex datasets, highlight them prominently. Discuss how you approached designing user experiences for these technologies.

• Storytelling: Present your projects as compelling stories, guiding the interviewer through your thought process and problem-solving journey.

Challenge Preparation:

• Frontend Fundamentals: Brush up on core JavaScript, React hooks, Context API, component lifecycle, performance optimization techniques (e.g., memoization, code splitting, lazy loading), and responsive design patterns.

• State Management: Be ready to discuss and implement solutions using Redux, Context API, or Zustand, understanding their trade-offs.

• AI/Generative AI Concepts: Familiarize yourself with basic concepts of Generative AI, LLMs, and agentic workflows. Understand how these technologies might influence UI design (e.g., conversational interfaces, streaming outputs).

• Problem-Solving: Practice solving algorithmic problems commonly found in frontend interviews. Focus on clean code, efficiency, and clear communication of your thought process.

• System Design (Frontend): Be prepared for high-level discussions on how to architect scalable and maintainable frontend applications.

📝 Enhancement Note: The emphasis on portfolio review and specific AI/Generative AI frameworks suggests that candidates will be evaluated not just on core coding ability but also on their understanding of emerging technologies and their application in creating user-centric solutions.

🛠 Tools & Technology Stack

Primary Tools:

• Core Frontend Frameworks: React, Angular (though React/TypeScript is primary), Node.js.

• Languages: JavaScript, TypeScript.

• State Management: Redux, Context API, Zustand.

• Component Development: Storybook.

• Build Tools: Vite, Next.js.

• AI/ML Integration Frameworks (Preferred): LangChain, LangGraph, Google ADK, Vercel AI SDK.

• AI Coding Assistants: GitHub Copilot, Cognition.ai's Devin (access/familiarity).

Analytics & Reporting:

CRM & Automation:

• Not directly applicable to the core UI development responsibilities, but understanding how frontend applications integrate with broader enterprise systems and workflows within a financial institution is valuable.

📝 Enhancement Note: The technology stack is heavily skewed towards modern frontend development, with a significant emphasis on React and TypeScript. The inclusion of AI-specific frameworks as preferred skills highlights the role's focus on cutting-edge AI applications.

👥 Team Culture & Values

Operations Values:

• Innovation & AI Integration: A strong drive to explore and implement the latest AI and Generative AI technologies to solve business challenges and create innovative solutions.

• Data-Driven Excellence: Commitment to using data and analytics to inform decisions, measure impact, and drive continuous improvement in both business outcomes and technical solutions.

• Client Focus: Dedication to enhancing client experience and driving business growth through effective product and service offerings, supported by advanced analytics and intuitive interfaces.

• Collaboration & Teamwork: Emphasis on working effectively across diverse teams (AI engineers, software engineers, product partners, business stakeholders) to achieve shared goals.

• Quality & Reliability: A commitment to building production-grade, reliable, and maintainable software solutions with high standards for code quality and user experience.

Collaboration Style:

• Cross-Functional Integration: Expect a highly collaborative environment where UI developers work closely with data scientists, AI engineers, and product managers. This involves frequent communication, joint problem-solving sessions, and shared ownership of project outcomes.

• Agile & Iterative: The team likely operates with an agile mindset, embracing iterative development, regular feedback loops, and adaptability to evolving project requirements and technological advancements.

• Knowledge Sharing: A culture that encourages sharing best practices, learnings from AI experiments, and technical insights, potentially through internal demos, code reviews, and documentation.

📝 Enhancement Note: The team culture appears to blend a strong technical foundation with a forward-looking approach to AI and data. Collaboration is key, and values are centered around innovation, data-driven results, and client impact within the financial services domain.

⚡ Challenges & Growth Opportunities

Challenges:

• Rapidly Evolving AI Landscape: Staying current with the fast-paced advancements in Generative AI, LLMs, and related UI paradigms.

• Complex AI Integration: Translating abstract AI capabilities and complex data insights into intuitive and user-friendly interfaces that are both functional and engaging.

• Balancing Innovation with Stability: Delivering cutting-edge AI features while ensuring the robustness, scalability, and reliability required for enterprise-level financial applications.

• Cross-Functional Communication: Effectively bridging the gap between technical AI concepts and business stakeholder needs, ensuring clear communication and alignment.

• Performance Optimization: Ensuring that AI-driven interfaces, especially those involving real-time data or complex processing, remain performant and responsive.

Learning & Development Opportunities:

• Deep Dive into AI/GenAI: Opportunities to gain hands-on experience with leading AI frameworks (LangChain, etc.) and contribute to the development of innovative AI-powered applications.

• Advanced Frontend Techniques: Continuous learning in modern React patterns, TypeScript, state management, and performance optimization.

• Financial Services Domain Expertise: Developing a specialized understanding of Treasury and Trade Solutions, which can open doors to further opportunities within Citi.

• Leadership and Mentorship: Potential to grow into lead roles, mentor junior developers, and influence the technical direction of AI UI development within the team and organization.

• Industry Exposure: Access to internal and external training, workshops, and potentially conferences related to AI, frontend development, and financial technology.

📝 Enhancement Note: The challenges are directly related to the cutting-edge nature of the role, particularly the integration of AI. The growth opportunities highlight a clear path for specialization and advancement within a high-demand field.

💡 Interview Preparation

Strategy Questions:

• AI-First UI Design: "Describe your approach to designing a user interface for a Generative AI assistant that needs to handle complex financial queries and provide real-time, streaming responses. What key UI patterns would you employ?"

• React Architecture: "How would you structure a large-scale React application to ensure maintainability, scalability, and efficient state management, particularly when integrating with real-time data streams or AI services?"

• Performance Optimization: "Imagine a scenario where a new AI feature is causing significant slowdowns in your application. What steps would you take to diagnose and resolve performance issues?"

• Collaboration with AI Engineers: "How do you ensure effective communication and collaboration with AI engineers and data scientists when translating their models and algorithms into user-friendly interfaces?"

Company & Culture Questions:

• "What interests you about working at Citi, specifically within the TTS Analytics team and the financial services industry?"

• "How do you stay updated with the latest trends in frontend development and Generative AI?"

• "Describe a time you had to adapt to a significant technological change or a new project requirement. How did you handle it?"

Portfolio Presentation Strategy:

• Structure: For each project, use the STAR method (Situation, Task, Action, Result) or a similar problem-solution-outcome framework.

• Visuals: Use clear, concise visuals (screenshots, mockups, live demos if possible) to illustrate your work. Highlight key UI elements and interactions.

• Technical Breakdown: Be ready to explain your technical stack, architectural decisions, and specific code implementations. Focus on the "why" behind your choices.

• Impact & Metrics: Quantify the impact of your work whenever possible. If direct metrics aren't available, discuss the intended business value and how your UI design contributes to it. For AI projects, discuss how the UI facilitates the AI's functionality and user adoption.

• AI/GenAI Focus: If presenting AI-related projects, explain the user problem, how the AI solves it, and how your UI made that solution accessible and effective.

📝 Enhancement Note: Interview preparation should focus heavily on demonstrating not just core frontend skills but also an understanding of AI concepts and their application to UI design, along with strong problem-solving and communication abilities.

📌 Application Steps

To apply for this UI Developer position:

• Submit your application through the provided link on the Citi careers portal.

• Portfolio Customization: Tailor your resume and portfolio to highlight your strongest React, TypeScript, and UI development experience. Emphasize any projects involving real-time data, streaming, or AI/Generative AI integrations.

• Resume Optimization: Ensure your resume clearly details your years of experience, core technical skills (React, TypeScript, Node.js, state management), and any experience with preferred technologies like LangChain or Next.js. Use keywords from the job description.

• Interview Preparation: Practice answering common frontend technical questions, behavioral questions, and prepare to present your portfolio with a focus on impact and technical depth. Be ready to discuss your approach to AI-first UI design.

• Company Research: Familiarize yourself with Citi's mission, its TTS division, and its recent initiatives in AI and digital transformation. Understand how this role contributes to the company's broader strategic goals.

⚠️ Important Notice: This enhanced job description includes AI-generated insights and operations industry-standard assumptions. All details should be verified directly with the hiring organization before making application decisions.