Front End Developer and Graphic Designer

📍 Job Overview

Job Title: Front End Developer and Graphic Designer

Company: Excis Compliance Ltd

Location: Quezon City, Metro Manila, Philippines

Job Type: Full-Time

Category: Software Development & Design Operations

Date Posted: May 27, 2026

Experience Level: Mid-Level (2-5 years)

Remote Status: On-site

🚀 Role Summary

• This role is pivotal in modernizing the user experience and visual identity of approximately 18 existing applications, requiring a blend of sophisticated frontend development and cutting-edge graphic design skills.

• A core expectation is the strategic integration and leverage of Artificial Intelligence (AI) tools across the entire workflow, from initial concept generation and prototyping to code development and asset creation, aiming to amplify productivity and creative output.

• The position demands leadership in driving UI/UX improvements, ensuring a consistent and accessible design language, and optimizing performance across the product suite, utilizing modern frontend frameworks and design systems.

• This is an on-site, full-time position based in Quezon City, Metro Manila, Philippines, emphasizing collaborative teamwork and hands-on contribution within a dynamic IT environment.

📝 Enhancement Note: The raw job description clearly outlines a dual role requiring expertise in both frontend development and graphic design, with a significant emphasis on AI integration. The role is positioned as a leader in redesigning existing applications, implying a need for strategic thinking and execution beyond basic development tasks. The "Mid-Level" experience inferred suggests candidates should have a solid foundation and demonstrable project experience in both disciplines.

📈 Primary Responsibilities

• Spearhead the comprehensive frontend redesign of approximately 18 applications, focusing on modernizing User Interface (UI) and User Experience (UX) to ensure consistency, accessibility, enhanced performance, and superior usability across the entire product suite.

• Develop and implement responsive, pixel-perfect web applications and robust design systems, fostering seamless collaboration with backend engineering teams for efficient API integration and optimized data flow.

• Actively leverage AI coding assistants (e.g., GitHub Copilot, Cursor, Claude Code, Codeium) to accelerate development cycles, expedite debugging, refine code refactoring, and maintain high standards of clean, secure, modular, and well-documented code quality.

• Create high-fidelity UI/UX designs, wireframes, interactive prototypes, engaging motion graphics, and compelling brand assets utilizing industry-standard tools such as Figma and Adobe Creative Suite, alongside advanced AI design tools like Midjourney, DALL·E, Adobe Firefly, and Stable Diffusion.

• Design and implement AI-augmented workflows, develop reusable prompt libraries, and establish robust Quality Assurance (QA) processes for AI-generated outputs, while continuously evaluating emerging AI tools and training team members on effective prompt engineering techniques.

• Integrate AI-powered product features, such as intelligent chatbots, advanced smart search functionalities, and personalized user experiences, to elevate product capabilities and user satisfaction.

📝 Enhancement Note: The responsibilities emphasize a leadership role in application redesign and AI integration. The expectation of leading redesigns for "approximately 18 applications" implies a need for project management skills and the ability to scale design and development efforts. The detailed mention of specific AI tools and techniques (prompt engineering, AI API integrations) highlights the critical nature of AI proficiency beyond basic usage.

🎓 Skills & Qualifications

Education:

Experience:

Required Skills:

• Frontend Development: Proficient in core web technologies including HTML5, CSS3/SCSS/Tailwind CSS, and JavaScript/TypeScript. Expertise in modern frontend frameworks such as React, Next.js, Vue.js, and Svelte is essential.

• Design Tools & Principles: Skilled in industry-standard design software including Figma, Adobe Creative Suite (Photoshop, Illustrator, InDesign, After Effects). Strong understanding of UI/UX principles, responsive design, and accessibility standards (WCAG).

• AI Integration & Prompt Engineering: Hands-on experience with AI coding assistants (e.g., GitHub Copilot, Cursor, Claude Code, Codeium) and AI design tools (e.g., Midjourney, DALL·E, Adobe Firefly, Stable Diffusion). Demonstrable expertise in AI prompt engineering for both code generation and visual asset creation.

• Version Control & CI/CD: Proficient in Git for version control and familiar with Continuous Integration/Continuous Deployment (CI/CD) pipelines for efficient software delivery.

• Portfolio: A comprehensive portfolio showcasing a strong blend of frontend development, UI/UX design, and graphic design work, including examples of AI-assisted projects and detailed documentation of your prompt engineering process.

Preferred Skills:

• Experience with prototyping tools such as Vercel v0, Lovable, Bolt.new, or Galileo AI.

• Familiarity with Content Management Systems (CMS), headless platforms, and no-code/low-code development tools.

• Understanding of AI API integrations (e.g., OpenAI, Anthropic, Replicate, Hugging Face) and experience developing AI-powered product features.

• Knowledge of SEO best practices and their implementation in frontend development.

• Experience with motion graphics and animation for UI elements.

📝 Enhancement Note: The requirements clearly delineate a dual-skill set. The emphasis on specific AI tools and "AI Prompt Engineering" is a key differentiator, suggesting candidates must not only use AI but understand its underlying principles and how to elicit optimal results. The portfolio requirement is exceptionally detailed, indicating it will be a primary evaluation tool.

📊 Process & Systems Portfolio Requirements

Portfolio Essentials:

• Integrated Showcase: The portfolio must compellingly demonstrate a fusion of frontend development prowess and sophisticated graphic/UI/UX design capabilities, with a clear emphasis on how these disciplines intersect.

• AI-Assisted Projects: Specific sections dedicated to projects where AI tools were instrumental in the design or development process. This should include documentation of the AI tools used, the prompt engineering strategies employed, and the specific impact on the project's outcome.

• Process Optimization Examples: Case studies illustrating how your work has led to measurable improvements in user experience, application performance, development efficiency, or design consistency. Highlight specific metrics and quantifiable results.

• System Design Thinking: Examples that showcase your understanding of design systems, component-based architecture, and how to create scalable, maintainable, and cohesive user interfaces and visual assets.

Process Documentation:

• Workflow Design & Optimization: Ability to document and articulate existing workflows, identify bottlenecks, and propose optimized processes using a combination of design thinking, development best practices, and AI integration strategies.

• AI Integration Methodologies: Clear documentation of how AI tools are integrated into the design and development lifecycle, including prompt development, output evaluation, and iterative refinement processes.

• Performance Analysis & Reporting: Experience in measuring and reporting on the impact of design and development initiatives, particularly those enhanced by AI, using relevant metrics related to user engagement, conversion rates, development speed, and design quality.

📝 Enhancement Note: The portfolio requirements are exceptionally detailed and specific, highlighting the critical need for candidates to curate their submissions to directly address the AI and dual-skill set requirements. This section explicitly asks for documentation of AI usage and its impact, which is a strong indicator of evaluation criteria.

💵 Compensation & Benefits

Salary Range:

• Estimated: PHP 70,000 - PHP 120,000 per month (approximately $1,200 - $2,000 USD at current exchange rates).

• Justification: This estimate is based on the role's mid-level experience requirement (2-5 years), the specialized and in-demand skill set combining frontend development and graphic design with advanced AI proficiency, and the location in Quezon City, Metro Manila, Philippines. The "Competitive Salary" stated in the original posting suggests a range that reflects the unique combination of technical and creative skills, especially with the strong emphasis on AI. This range is benchmarked against similar roles in the Philippine tech market, considering the specific tools and responsibilities outlined.

Benefits:

• Competitive Salary: A strong base salary reflecting your skills and experience.

• Performance-based Bonuses: Opportunities to earn additional compensation based on individual and company performance.

• Full Access to Premium AI Tools and Subscriptions: Comprehensive access to leading AI tools (e.g., Midjourney, GitHub Copilot, Adobe Creative Suite, Figma) essential for the role.

• Dedicated AI Learning Budget: Financial support for continuous learning and skill development in AI, including courses and certifications.

• Conference Attendance: Opportunities to attend relevant industry conferences, both for AI and for frontend development/design.

• Modern On-site Workspace: A comfortable and technologically equipped workspace in Quezon City designed for collaboration and productivity.

• Collaborative Team Environment: Work within an innovative and supportive team that values experimentation and knowledge sharing.

• Professional Growth Opportunities: A clear path for career advancement and skill enhancement within a global IT leader.

Working Hours:

• Standard full-time hours, likely Monday to Friday, approximately 40 hours per week. The on-site nature suggests a structured office schedule, though flexibility may be available depending on team needs and project deadlines.

📝 Enhancement Note: The salary range is an estimate based on market research for mid-level roles with specialized skills in the Philippines. The benefits package is heavily weighted towards AI tools and learning, reinforcing the role's focus.

🎯 Team & Company Context

🏢 Company Culture

Industry: IT Services & Consulting, Compliance Technology. Excis Compliance Ltd operates within the technology sector, likely focusing on providing IT solutions and services, potentially with a specialization in compliance or regulatory technology. This industry context implies a need for precision, reliability, and continuous innovation.

Company Size: The LinkedIn data indicates a company size of 51-200 employees. This suggests a mid-sized organization that likely offers a balance between the structure of a larger company and the agility and close-knit feel of a smaller one, allowing for significant individual impact.

Founded: Founded in 2014, Excis has been operating for over a decade, indicating a stable and established presence in the market with a history of growth and adaptation.

Team Structure:

• Operations Team: The role likely sits within a broader product development or engineering team, reporting to a Lead Developer, Design Manager, or Head of Product.

• Cross-functional Collaboration: Expect close collaboration with backend developers, product managers, QA testers, and potentially marketing or sales teams to ensure a cohesive product vision and execution.

• Specialization: While this role is a hybrid, it may interface with more specialized roles (e.g., dedicated backend engineers, dedicated UI/UX researchers) for specific complex tasks.

Methodology:

• Agile Development: The mention of agile collaboration suggests the team likely follows Agile methodologies (e.g., Scrum, Kanban) for project management, emphasizing iterative development, flexibility, and continuous feedback loops.

• Data-Driven Design & Development: Given the focus on performance and user experience, expect a culture that values data analysis to inform design decisions, track user behavior, and measure the impact of implemented features.

• AI-First Approach: The company is clearly investing in AI, indicating a forward-thinking approach where AI tools are not just supplementary but integral to core operational processes and product development strategies.

Company Website: www.excis.com

📝 Enhancement Note: The company size and founding date suggest a mature but still growing organization. The emphasis on AI in the job description indicates a company culture that embraces innovation and technological advancement, likely within a structured yet agile development environment.

📈 Career & Growth Analysis

Operations Career Level: This role represents a mid-level position (2-5 years of experience) that acts as a crucial bridge between design and development. It's a specialized hybrid role that offers significant autonomy and leadership potential within its domain, particularly in driving the modernization of existing applications and championing AI integration.

Reporting Structure: The candidate will likely report to a senior member of the engineering or product team, such as a Development Lead, Design Manager, or Head of Product. This structure provides guidance while allowing for independent contribution.

Operations Impact: The role's direct impact is on the user-facing aspects of Excis's product suite. By leading redesigns and integrating AI, the candidate will significantly influence user satisfaction, application performance, brand perception, and operational efficiency within the development lifecycle. The successful execution of this role contributes directly to maintaining Excis's competitive edge and driving innovation.

Growth Opportunities:

• AI Specialization: Deepen expertise in AI tools, prompt engineering, and AI integration, potentially becoming a go-to expert for AI-driven development and design within the company.

• Technical Leadership: Progress into senior developer or lead designer roles, potentially managing a team of frontend developers or designers, or leading specific product initiatives.

• Product Strategy: Contribute to higher-level product strategy discussions, leveraging a unique understanding of both design and development to influence product direction and feature development, especially concerning AI integration.

• Full-Stack Expansion: With a strong foundation in frontend and design, there's potential to expand into backend development or become more involved in full-stack architecture if desired.

📝 Enhancement Note: The growth opportunities are strongly tied to the dual nature of the role and the emphasis on AI. Candidates are encouraged to see this as a platform for developing specialized, high-demand skills.

🌐 Work Environment

Office Type: The role is on-site, implying a traditional office environment. However, the benefit mentions a "Modern on-site workspace with collaborative team environment," suggesting an office designed to foster interaction and productivity, rather than a purely functional space.

Office Location(s): The primary work location is Quezon City Hall, Quezon City, Metro Manila, Philippines. This is a central area in Metro Manila, likely offering good accessibility for employees.

Workspace Context:

• Collaborative Hub: The "collaborative team environment" suggests an open-plan or shared workspace designed to encourage interaction, idea sharing, and teamwork among colleagues, including designers, developers, and potentially product managers.

• Technology-Rich: Given the focus on AI and modern development tools, the workspace is expected to be equipped with up-to-date technology, including powerful workstations, reliable internet, and access to necessary software licenses for design and development tools.

• Team Interaction: Regular opportunities for in-person collaboration, brainstorming sessions, code reviews, and design critiques are expected, facilitating a dynamic exchange of knowledge and best practices.

Work Schedule:

• A standard full-time work schedule is implied, likely aligning with typical business hours in the Philippines (e.g., 9 AM to 6 PM, Monday to Friday). While the role is on-site, the emphasis on efficiency through AI might allow for some flexibility in task management and work pacing, provided project deadlines and team collaboration needs are met.

📝 Enhancement Note: The "modern on-site workspace" and "collaborative team environment" suggest a company culture that values in-person interaction and provides a conducive atmosphere for creative and technical work.

📄 Application & Portfolio Review Process

Interview Process:

• Initial Screening: A review of your resume and portfolio to assess foundational skills in frontend development, graphic design, and AI tool usage.

• Technical Interview: This stage will likely involve coding challenges (e.g., JavaScript, React/Vue), design exercises, and discussions about your approach to UI/UX problems. Expect questions assessing your understanding of responsive design, accessibility, and performance optimization.

• AI Proficiency Assessment: A dedicated segment to evaluate your practical experience with AI tools. This could involve prompt engineering exercises, discussing your AI workflows, and demonstrating how you've used AI to enhance design or development outcomes.

• Portfolio Presentation: You will be asked to present and walk through key projects from your portfolio, specifically highlighting your contributions, design process, development methodology, and the impact of AI integration.

• Behavioral & Cultural Fit Interview: Questions aimed at understanding your problem-solving approach, collaboration style, how you handle feedback, and your alignment with Excis's innovative and AI-centric culture.

Portfolio Review Tips:

• AI Integration Spotlight: Clearly label and dedicate sections to projects where AI was a significant component. Detail your prompt engineering process, the specific AI tools used, and the tangible benefits achieved (e.g., faster development, novel design concepts).

• Quantify Impact: For both design and development projects, provide quantifiable metrics. How did your UI redesign improve user engagement? How did AI-assisted coding speed up delivery? Use data to back up your claims.

• Showcase Versatility: Ensure your portfolio demonstrates proficiency in both code (e.g., live demos, GitHub repositories) and design (e.g., mockups, prototypes, style guides).

• Process Narrative: For each project, explain your thought process, the challenges you faced, the solutions you implemented, and your role in the outcome. Tell a story about your problem-solving journey.

• Conciseness & Clarity: Organize your portfolio logically. Use clear descriptions, high-quality visuals, and easy-to-navigate links. Ensure it's accessible and easy for reviewers to grasp your capabilities quickly.

Challenge Preparation:

• Coding Fundamentals: Brush up on core JavaScript, HTML, CSS, and your primary framework (React/Vue). Be prepared for algorithm and data structure questions if applicable.

• Design Principles: Review UI/UX best practices, design system concepts, and accessibility standards. Be ready to critique existing interfaces or propose improvements.

• AI Prompting Practice: Practice crafting effective prompts for various AI tools (code generators, image generators) to achieve specific outcomes. Understand the nuances of prompt engineering for different tasks.

• Case Study Practice: Prepare a 1-2 minute "elevator pitch" for 2-3 key projects in your portfolio, focusing on the problem, your solution (especially AI integration), and the results.

📝 Enhancement Note: The interview process description emphasizes the dual nature of the role and the critical AI component. The portfolio review tips are tailored to highlight the specific requirements of this position, particularly the AI integration and quantitative impact.

🛠 Tools & Technology Stack

Primary Tools:

• Frontend Frameworks: React, Next.js, Vue.js, Svelte (proficiency in at least one is required, familiarity with others is a plus).

• Core Web Technologies: HTML5, CSS3, SCSS, Tailwind CSS, JavaScript, TypeScript.

• Design & Prototyping: Figma, Adobe Creative Suite (Photoshop, Illustrator, InDesign, After Effects).

• AI Coding Assistants: GitHub Copilot, Cursor, Claude Code, Codeium.

• AI Design Tools: Midjourney, DALL·E, Adobe Firefly, Stable Diffusion, Leonardo AI, Canva AI, Framer AI.

• Prototyping Tools (Preferred): Vercel v0, Lovable, Bolt.new, Galileo AI.

Analytics & Reporting:

• While not explicitly detailed, expect to work with tools for tracking frontend performance, user engagement, and conversion rates. This could include Google Analytics, or more specialized tools integrated into the product suite.

CRM & Automation:

• Familiarity with Content Management Systems (CMS), headless platforms, and potentially no-code/low-code tools for rapid development or integration.

• Understanding of API integrations (OpenAI, Anthropic, Replicate, Hugging Face) is crucial for AI feature development.

📝 Enhancement Note: This section consolidates the extensive list of tools mentioned in the job description, providing a clear overview of the expected technical stack. The emphasis on AI tools is paramount.

👥 Team Culture & Values

Operations Values:

• Innovation & AI Embrace: A strong commitment to exploring, adopting, and leveraging cutting-edge AI technologies to drive efficiency, creativity, and product excellence.

• Quality & Craftsmanship: A dedication to producing high-quality, well-engineered code and aesthetically pleasing, user-centric designs.

• Collaboration & Knowledge Sharing: An environment where teamwork is paramount, and members actively share insights, learn from each other, and contribute to collective problem-solving.

• User-Centricity: A focus on understanding user needs and delivering exceptional digital experiences that enhance satisfaction and achieve business objectives.

• Continuous Learning: A culture that encourages and supports ongoing professional development, particularly in the rapidly evolving fields of AI, frontend development, and design.

Collaboration Style:

• Hybrid Approach: Expect a mix of in-person collaborative sessions (brainstorming, design critiques, pair programming) and asynchronous communication (e.g., Slack, project management tools) for updates and discussions.

• Cross-Functional Synergy: A strong emphasis on breaking down silos between design and development, fostering a unified approach to product creation where designers and developers work hand-in-hand.

• Feedback-Driven: An open culture for providing and receiving constructive feedback on code, designs, and processes to ensure continuous improvement.

📝 Enhancement Note: The values and collaboration style are inferred from the job description's emphasis on AI, modern tools, and a collaborative environment. This highlights the company's forward-thinking and team-oriented approach.

⚡ Challenges & Growth Opportunities

Challenges:

• Mastering the Hybrid Role: Effectively balancing and excelling in both frontend development and graphic design responsibilities, especially under project deadlines.

• AI Integration Complexity: Navigating the rapidly evolving AI landscape, selecting the most effective tools, and integrating them seamlessly and ethically into existing workflows.

• Maintaining Design Consistency: Ensuring a cohesive design language across ~18 applications, each potentially with its own history and technical constraints, while introducing modern UI/UX principles.

• Rapid Technological Evolution: Staying abreast of new frontend frameworks, design trends, and AI advancements requires a commitment to continuous learning.

Learning & Development Opportunities:

• AI Specialization: Gain deep expertise in prompt engineering, AI model integration, and the application of AI in creative and development processes, becoming a subject matter expert.

• Advanced Framework & Tool Mastery: Opportunity to become highly proficient in modern frontend frameworks and advanced design tools, potentially leading to senior technical or design roles.

• Product Strategy Influence: Contribute to shaping the future of Excis's product suite, particularly in how AI enhances user experience and operational efficiency.

• Mentorship: Potential to receive mentorship from senior leaders and, in turn, mentor junior team members as your expertise grows.

📝 Enhancement Note: Identifying potential challenges helps candidates prepare for the realities of the role, while highlighting growth opportunities frames the position as a stepping stone for career advancement.

💡 Interview Preparation

Strategy Questions:

• AI Integration Strategy: "Describe a specific instance where you used AI tools to overcome a development or design challenge. What was your prompt engineering process, and what was the outcome?" Prepare to discuss how you evaluate AI-generated outputs for quality and accuracy.

• Hybrid Role Management: "How do you prioritize tasks when balancing frontend development and graphic design responsibilities? Walk us through your process for managing multiple complex projects simultaneously."

• Design System Implementation: "Imagine you need to create a design system for a suite of 18 applications. What key components would you prioritize, and how would you ensure consistency across all platforms?" Be ready to discuss your approach to accessibility and responsive design.

Company & Culture Questions:

• AI Vision: "Where do you see the biggest opportunities for AI to transform the frontend development and design process in the next 2-3 years?" Prepare to share your vision and how it aligns with Excis's focus.

• Collaboration Scenarios: "Describe a time you had a disagreement with a team member regarding a design or technical approach. How did you resolve it?" Focus on collaborative problem-solving and constructive feedback.

• Impact Measurement: "How would you measure the success of a major UI/UX redesign initiative, particularly one enhanced by AI?" Be ready to discuss key performance indicators (KPIs) and reporting methods.

Portfolio Presentation Strategy:

• AI-Centric Storytelling: For AI-assisted projects, clearly articulate the "before" (problem), the "AI intervention" (your prompts and process), and the "after" (enhanced outcome).

• Quantifiable Results Focus: Throughout your presentation, emphasize metrics. Show how your work improved user engagement, reduced development time, or enhanced design quality.

• Code & Design Synergy: Clearly delineate your contributions to both code and design for each project. If possible, provide live demos or interactive prototypes.

• Concise & Engaging Delivery: Practice presenting your work within a set time limit, ensuring clarity, enthusiasm, and the ability to answer follow-up questions confidently.

📝 Enhancement Note: These interview questions are designed to probe the core competencies required for this unique hybrid role, with a strong emphasis on practical application of AI and a clear understanding of the candidate's ability to manage diverse responsibilities.

📌 Application Steps

To apply for this operations position:

• Submit your resume, portfolio, and a brief note describing your current AI workflow via the application link provided.

• Portfolio Customization: Tailor your portfolio to prominently feature projects showcasing your combined frontend development and graphic design skills. Specifically highlight any projects where AI tools were leveraged, detailing your prompt engineering process and the impact on project outcomes.

• Resume Optimization: Ensure your resume clearly articulates your proficiency in relevant technologies (React, Vue, Figma, Adobe Suite, AI tools) and highlights achievements with quantifiable results, especially those related to UI/UX improvements or development efficiencies gained through AI.

• AI Workflow Articulation: Prepare to discuss your experience with AI tools in your application note and during interviews. Be ready to explain how you integrate AI into your daily design and development tasks, and how you ensure the quality and ethical use of AI-generated outputs.

• Company & Role Research: Research Excis Compliance Ltd, focusing on their current product offerings and any public statements regarding their technology strategy or AI initiatives. Understand how your unique skill set can contribute to their 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.