A time-boxed enterprise assessment reframed as a coherent interaction-system proposal.
Turning a fragmented HR suite into a clearer, task-led enterprise experience.
I audited OrangeHRM Enterprise across onboarding, navigation, data-heavy administration and employee-facing communication, then redesigned four representative workflows: News, Add News, Leave Calendar and Buzz. The proposal replaced scattered controls and weak hierarchy with a coherent product shell, glanceable status, focused forms and clearer social and planning patterns.
Core enterprise surfaces redesigned end to end
User states audited: prospective trial users and returning users
Pages of audit evidence, recommendations and final design work
Production or live-user outcomes claimed
Section 1 of 9Overview
Overview
A visual redesign exercise became a systems-level enterprise UX case study.
The assignment asked for four redesigned screens, but the product evidence showed that isolated visual treatment would not solve the underlying issues. Navigation, search, tables, forms, status communication and account context were behaving as separate patterns. I therefore treated the work as a compact product-system intervention rather than four unrelated mock-ups.
Audit through final UI
I independently completed the trial walkthrough, heuristic and accessibility review, issue synthesis, product-structure proposal and four high-fidelity redesigns.
Evidence plus design direction
The submission combined a 28-page audit and recommendation report with annotated current-state evidence and final concepts for four representative workflows.
Assessment, not a live product cycle
The work used a trial environment and did not include access to customers, production analytics, engineering feasibility review or post-launch measurement.
Brief
The brief combined product inspection with redesign across administrative and employee-facing experiences.
The work began by creating a trial instance with data, reviewing Employee List and Add Goals, and redesigning four workflows from the enterprise suite. This created a useful spread of interaction types: a data table, a publishing form, a calendar and a social feed.
News
Administrative table, publication status, targeting, attachments and acknowledgements.
Add News
Content authoring, optional attachment, acknowledgement request and publishing action.
Leave Calendar
Time navigation, leave-type semantics, lifecycle status and multi-day events.
Buzz
Posting, media sharing, recognition, feed consumption, messages and anniversaries.
The design problem was not “make OrangeHRM look newer.” It was to make a broad enterprise product explain location, status and next action consistently.
Audit
The audit exposed recurring product debt rather than four isolated screen defects.
I reviewed the trial journey for both prospective and returning users, then inspected navigation, employee data, goals, announcements, leave and social communication. The same issues appeared repeatedly: fragmented hierarchy, redundant destinations, poorly placed controls, weak status semantics, contrast failures and inconsistent component behaviour.
Experience walkthrough
Move through trial activation, sign-in and core enterprise tasks as a first-time and returning user.
Heuristic review
Inspect hierarchy, consistency, recognition, error prevention, control placement and information density.
Accessibility check
Review contrast, legibility, visual reliance and the product’s behaviour under performance constraints.
Pattern synthesis
Translate local defects into reusable principles for navigation, forms, tables, calendars and feeds.
Recurring failure patterns
Navigation did not communicate product structure
Primary, secondary and page-level controls competed for attention. Duplicate or weakly differentiated destinations made it difficult to predict where a task belonged.
Search and filters were detached from the objects they controlled
Controls frequently lived inside navigation ribbons rather than beside tables, lists or calendars, weakening cause and effect.
Status required interpretation
Publication, acknowledgement, goal and leave states were inconsistently styled or insufficiently labelled, increasing scan effort in data-heavy workflows.
Visual hierarchy and spacing were uneven
Dense controls, weak negative space and inconsistent asset styling made the product feel incomplete and harder to process.
Accessibility and performance affected trust
The report identified contrast issues, slow or incomplete rendering and poor optimisation as first-impression and task-completion risks.
Definition
Reframe the redesign around enterprise comprehension.
The concept needed to preserve OrangeHRM’s recognisable brand while making each workflow easier to locate, scan and complete. The four screens also needed to feel like parts of one product rather than independent design exercises.
How might we reduce navigation and information-processing friction across administrative, planning and social workflows without hiding enterprise capability?
Users should understand where they are, see the relevant controls beside the content they affect, recognise status at a glance and complete each task through a consistent action hierarchy.
| Audit signal | Design direction | Applied across |
|---|---|---|
| Fragmented navigation | Persistent grouped sidebar, breadcrumb and page-specific toolbars | All four surfaces |
| Controls detached from content | Move search, filter and create actions beside the relevant object | News and Leave Calendar |
| Weak state communication | Use labelled chips and icon-supported status rather than ambiguous colour alone | News and Leave Calendar |
| Overloaded forms | Separate required content, optional files, acknowledgement and final actions | Add News |
| Unstructured social feed | Use a recognisable composer, feed and secondary-information layout | Buzz |
Principles
Five principles kept the concept coherent across four different tasks.
Location before action
Breadcrumbs, grouped navigation and page titles should establish context before exposing task controls.
Controls belong with their object
Search, filter, create and view controls should sit beside the table, calendar or feed they change.
Status must be readable at a glance
Use text labels, restrained colour and consistent iconography so enterprise states do not depend on interpretation.
Progressive task focus
Forms and dense pages should surface the next decision without presenting every capability at equal visual weight.
One shell, many workflows
Typography, spacing, page anatomy and action hierarchy should remain familiar even when the task changes.
Redesign
Four workflow redesigns demonstrate the system rather than merely restyling it.
Each redesign addresses a distinct interaction problem while repeating the same navigation, spacing, status and action rules.
Make announcement management operationally scannable
The News table separates creation, search and filter controls from global navigation. Status, target locations, roles, attachments and acknowledgement appear as compact, comparable fields.
Global navigation, table tools and status information competed within the same visual layer.
Separate page context from table actions, then encode publication, targeting and acknowledgement as comparable fields.
Administrators should scan records faster and understand the next available action with less interpretation.
Turn news creation into a focused publishing task
The original page mixed a rich-text editor, attachment instruction, acknowledgement and next/back controls without a clear sequence. The concept uses a focused overlay with direct prompts, a dedicated upload area and explicit publishing intent.
A generic rich-text editor dominated the task while optional attachment and acknowledgement decisions were visually weak.
Use a focused publishing overlay, direct field prompts, a dedicated upload area and an explicit primary action.
The clearer sequence should reduce decision load and lower the likelihood of incomplete publishing attempts.
Make leave type and leave status readable in one calendar
The revised calendar brings search and filtering into the calendar toolbar, supports month/year/day switching and separates leave categories from approval lifecycle states.
Calendar navigation, filtering and the legend were weakly organised, making leave type and workflow state easy to conflate.
Separate category filters, time controls and lifecycle states while retaining text labels alongside colour.
Users should distinguish what an event is from where it sits in the approval process more reliably.
Rebuild Buzz around recognisable workplace-social behaviours
The original feed lacked a coherent hierarchy and contained weakly separated side content. The redesign uses a story/update row, focused composer, media and recognition actions, structured posts and secondary panels for communication and milestones.
The feed lacked a clear creation-to-consumption hierarchy and mixed secondary workplace information into the primary experience.
Establish a recognisable composer and feed, then move messages and anniversaries into a subordinate right rail.
Employees should understand how to contribute, browse and access supporting context without losing their place.
Product system
The strongest output was the shared product logic across the four concepts.
The redesigns repeatedly use the same page anatomy: grouped persistent navigation, breadcrumb and global support, a descriptive page header, context-specific tools, a clearly bounded work surface and predictable secondary information.
Grouped destinations, persistent account context, clear log-out placement and current-section emphasis.
Breadcrumb, title, supporting explanation, task toolbar and a bounded content region.
Search and filters sit beside tables and calendars, with explicit pagination and sorting cues.
Chips, labels and icons communicate status through more than colour alone.
Reduced interpretation
Status, targeting, acknowledgement and publishing actions become easier to compare across records.
More recognisable interaction models
Calendar and social patterns reuse familiar concepts while retaining enterprise-specific meaning.
Reusable interface grammar
The same hierarchy can extend to additional tables, authoring tasks, planning views and communication modules.
Evaluation
The proposal is evidence-informed, but it is not validated product impact.
The assessment supports a reasoned design direction through documented product walkthroughs, heuristic observations, contrast inspection and direct comparison. It does not include moderated usability testing, implementation feasibility review or post-launch analytics.
Evidence retained
- The original OrangeHRM assignment brief.
- A 28-page audit and recommendation report.
- Annotated screenshots of the current product.
- Four high-fidelity redesign frames.
- Documented concerns around navigation, hierarchy, contrast and optimisation.
Evidence not available
- Representative user interviews or usability sessions.
- Task success, time-on-task or error-rate comparisons.
- Responsive and mobile prototypes.
- Engineering feasibility or component-library mapping.
- Production adoption, satisfaction or business outcomes.
How I would validate the next iteration
Admin publishing
Create, target and publish an announcement; identify publication and acknowledgement status from the table.
Leave comprehension
Find a leave period, distinguish leave type from approval status and move between month and day views.
Buzz participation
Create a post, share media, recognise a colleague and locate recent communication without losing feed context.
Reflection
The exercise demonstrates systems thinking — and also shows where my process would be stronger today.
The final work successfully connected audit findings to interface decisions across different enterprise tasks. With more time, I would reduce visual density further, formalise accessibility tokens, prototype responsive behaviour and validate the taxonomy before polishing every screen.
Cross-surface coherence
The strongest decision was treating navigation, state and page anatomy as product-wide rules rather than screen-level decoration.
Navigation density
The concept still exposes a large enterprise menu. A role- and frequency-informed information architecture would reduce visible destinations.
Colour and semantics
Calendar and status systems should be tested for contrast, colour-vision differences and comprehension without relying on legends.
The project taught me that redesigning enterprise software is not about removing complexity. It is about making complexity predictable, legible and appropriately staged.
Need a guided walkthrough of the work and decision-making?
Start a conversation