End-to-end Company Intranet Reoranization & Rebranding

Timeline

10 weeks June-August 2025 Summer Internship

Tools

Figma, Protopie, HTML, React Native, Sharepoint, Vercel, Balsamiq

Project Summary

Roles & Responsibilities

UX/UI Design & Deployment End-to-End Prototyping Stakeholder Engagement

Mentors

Shakil Khan, Shiji Mathew, Afsar Alam, Ajay Jain

Spearheaded the brand redesign of ACME’s Intranet, reducing employee task friction by 40% and transcending the platform into interactive community where employees contribute, work and thrive. Design will be shipped by the end of 2025.

OVERVIEW

Who are ACME?

ACME (Almoayyed Computers Middle East) is the flagship division of Almoayyed International Group and operates as a leading Cloud & Managed Service Provider, Application Implementer, and System Integrator based in the Kingdom of Bahrain. With a portfolio spanning over four decades, ACME is the most reputable ICT companies in the Gulf region, offering services from buiness intelligence to cloud migration and cybersecurity.

Enterprise Applications & Business Intelligence

Core Business Integrations through different ERP & CRMs

My Role < UX Designer, Front-End Developer >

Impact & Achievements:

❈ Empowered Employee Voice

WORKPLACE DYNAMICS

Artificial Intelligence Solutions and B2B Optimization

Big Data Integration to enhance decision making & operations

During the 10 weeks that I interned at Almoayyed Computers Middle East (ACME), I worked as front-end product experience designer on a cross functional team of 4 mentors and 6 interns to redesign the company’s intranet. I lead the end-to-end UX process from brainstorming a new design direction to leading ideation workshops, defining new user flows and designing high fidelity prototypes that guided our product direction.

I lead the rebrand of the new design system, upscaling the overall UI and ensuring consistency to ACME’s parent company, Almoayyed International Group, while revamping +30 webpages to be fully responsive and aligned with the new brand identity. In addition to my design responsibilities, I also coordinated task prioritization within the intern team, facilitated design reviews with mentors and stakeholders, and translated feedback into actionable design iterations.

Created accessible feedback channels and idea submission portals that gave every employee a direct line to leadership.
Introduced dedicated spaces for employees to share their stories, celebrate achievements, and showcase personal milestones, transforming the intranet into a vibrant community hub where every voice could be heard and recognized.

❈ Employee Storytelling Platform

COLLEAGUE CONNECTION

Integrated comment systems, support mechanisms, and reaction features that encouraged employee-to-employee interaction.
From sharing updates and uploading content to participating in polls and providing feedback, multiple touchpoints transform the intranet into an evolving platform shaped by its community.

Cloud Integration with AWS, Azure and Oracle

Distributed Project Management across hybrid cloud environments

❈ Improved Accessibility

USER WORKFLOWS

Designed mobile-first responsive layouts using an 8-point grid system and breakpoint strategy, achieving 100% feature parity across desktop, tablets and other interactive devices.
Conducted usability testing on 3 device types with 15 field and remote employees, validating that 92% could complete critical tasks on surface tablets and monitors without friction.

BACKGROUND

ALMOAYYED COMPUTERS
INTRANET REQUIRED A REDESIGN & REBRAND.

PROBLEM SPACE

REFRAMED PROBLEM STATEMENT

Almoayyed International Group had recently undergone a rebranding initiative that simpified their branding to give a more modern and minimalist vision. However, the intranet’s user interface continued to follow older design principles leading to a lack of cohesion and poor usability- often causing lower interactivity and limited experience of company culture amongst colleagues.

ACME’s Intranet follows outdated UI patterns, with unclear workflows, redundant steps and lack of intuitive design that lowers productivity

How might we redesign the ACME Intranet to strengthen colleague connection, increase interactivity and make every employee feel informed, valued and proud to be a part of the ACME Family?”

Core Solution Elements:

End-to-End UX Process: I directed the complete UX lifecycle from initial discovery and brainstorming sessions through final high-fidelity prototypes, ensuring consistent user insights throughout the project.

Collaborative Ideation: Facilitated cross-functional ideation workshops with mentors, stakeholders, and the intern team to generate diverse perspectives and build consensus around design direction.

Responsive Redesign: Transformed all 30+ webpages into fully responsive experiences optimized for desktop, tablet, and mobile devices, ensuring accessibility across all user contexts.

Comprehensive Design System: Created a unified design system that bridged ACME's identity with Almoayyed International Group's brand guidelines, establishing reusable components, color palettes, typography standards, and interaction patterns.

IMPROVED INFORMATION ARCHITECTURE

❈ Our Final MVP

Unified Search

Designed an improved search experience in with filtering, suggestions, and categorization to help users quickly locate specific information.

Minimalist Iconography

Developed a custom icon set that balanced functional clarity with visual personality, maintaining consistency with the overall design language.

A SNEAK PEEK INTO OUR DESIGN

Content Prioritization

Established clear content hierarchies based on past usage data and user needs, ensuring the most important and frequently accessed information was prominently displayed.

Task-Based Organization

Reorganized content around common user tasks and workflows, improving findability and task completion rates.

Simpler User Flows

Implemented consistent global navigation, contextual menus, and breadcrumb trails to help users understand their location and available options at all times.

❈ Design Process & Deliverables

User Flows and Task Analysis

Mapped critical user journeys including employee onboarding, policy lookup, department directory navigation, and resource requests. These flows revealed pain points and opportunities for streamlining interactions, which directly informed wireframe development.

IA VALIDATION PROTOCOL

Conducted card sorting exercises and tree testing sessions with representative users to validate the new structure before moving into visual design. This iterative approach ensured the final architecture aligned with user mental models.

IDEATION & BRAINSTORMING WORKSHOP

❈ Low-Fidelity Wireframes

Created low-fidelity wireframes on Balsamiq for all major page templates and user flows. The wireframing phase focused on simplifying the layout structure, content hierarchy, and interaction patterns without the distraction of visual elements. This allowed for rapid iteration with multiple rounds of stakeholder feedback and usability testing.

PROTOTYPING & TESTING

❈ High-Fidelity Prototypes

Developed interactive, high-fidelity prototypes that brought the wireframes to life within the new design system. These prototypes were integrated through Sharepoint and hybrid SPFx using React and HTML, demonstrating responsive behavior across friction points, micro-interactions, and complete user flows. The prototype was presented to the board and was approved by developementteam, and set to be shipped in December, 2025.

Prototype features include:

Fully responsive layouts (Responsive to mobile, tablet, desktop devices)
Interactive navigation and filtering components
Real content examples for context
Hover states, transitions, and animations- using Javascript libraries like React and WebGL
Complete multi-step workflows across cross-functional teams

Due to NDA, I cannot reveal all the deliverables in this page. If you wish to learn more about the project, please reach out to me through my email or socials and I can catch you up with everything I learned, curated and discovered through this experience!

DESIGNING SYSTEM COMPONENTS

❈ Brand Strategy

Color Palette

Harmonized ACME's technology-focused brand colors with Almoayyed International Group's corporate palette, creating a cohesive yet distinctive visual language. Primary colors conveyed trust and professionalism while accent colors added energy and modernity.

Component Library

Typography:

Adopted consistent typeface families that aligned with the parent brand while ensuring excellent readability across devices. Established clear hierarchy through size, weight, and spacing standards.

Grid System

Implemented a flexible 12-column grid that ensured consistency across all page templates while allowing for creative layout variations.

Created reusable UI components including buttons, form elements, cards, navigation patterns, and data tables. Each component included states (default, hover, active, disabled) and responsive behavior specifications.