HR data

Flexspring- HR iPaaS

Head of Design
Product Team
Remote
  • Prepare, maintain, review, and obtain approval for storyboards, mockups, wireframes, page layouts, and visual resources for our user-facing iPaaS application, Flexspring.

  • Work with product management to design innovative, elegant, and easy to maintain layouts, workflows, visuals, and UI components.

  • Design and build page layouts that support the white labeling of UIs.

Data Visualization

Integration Flow Redesign

Goal: reduce complexity and cognitive load by giving the user a more focused and accessible experience.
Improve overall design, use color coding for easier navigation and a better user experience.
Update icons inside top toolbar with a more modern, universal choices.

case study

Data Mapper

The Visual Data Mapper project addresses the need for a user-friendly solution to create data mappings. Currently, mapping tasks require coding skills and are limited to senior integrator specialists. Our goal is to provide an intuitive and visual tool that can be used by anyone, regardless of their technical expertise. By eliminating the need for coding, the Visual Data Mapper allows users to easily create mappings through a visual interface. This empowers a wider range of users to efficiently define data relationships, resulting in streamlined processes and increased productivity.

custom data mapping project
Design of a visual mapper
Data mapping is the process of matching data fields from one database to another.
Plan: evaluate competition- see what they do right and what they do wrong when designing our own data mapper for Flexspring.
Informatica

'Floating' elements, an unnecessary horizontal scroll bar (there is enough space in the middle). 'Type' can be represented with an icon.

03

Jitterbit

We like that this mapper show variable types and has a record counter/generator, as well as an ability to test with payloads to visually map this out.

01

Boomi

It's tied hard to source and target (makes it non-usable). Missing the ability to add a field.

02

Informatica

'Floating' elements, an unnecessary horizontal scroll bar (there is enough space in the middle). 'Type' can be represented with an icon.

03

Jitterbit

We like that this mapper show variable types and has a record counter/generator, as well as an ability to test with payloads to visually map this out.

01

Competitor Analysis: Assessing the Data Mapping Landscape

After analyzing competitors in the data mapping landscape, we have identified key takeaways to incorporate into our data mapper. These takeaways are based on best practices, user feedback, and opportunities for improvement. By integrating these elements, our mapper will effectively address user needs and surpass existing competitors. The main takeaways from our analysis include:

What we want to include in our product
  • Visual source to target
  • Ability to edit and put logic behind the mapping
  • Restrict to JSON payloads
  • Ability to change source and target format
  • Ability to change source/target structure for a particular object
  • Test transformation option once mapped to show resulting JSON payload
Data Mapping Configuration Version 1 (drop-down option)

Integration Workflow

Used by the Data Mapping task in Integration Workflow processes.

Visual Tool

Tool that visually describes the flow of work.

Save as a Template

Start with your beginning and endpoints- can be saved as a template for future use.

Mapping object the from the right Toolbar
Grab and Drag a Mapping Object

Users can simply grab a mapping object from the toolbar and drag it onto the interface where the mapping process takes place.

Drag, Drop, and Configure

This intuitive approach saves time, reduces errors, and facilitates seamless data transfer between systems or sources, enhancing data integration and streamlining workflows.

Design of icon & object element, UI flow redesign
wireframes
the results
Intuitive Interface for Seamless Data Mapping
result

High-fidelity prototype

The bottom navigation features a "Test Transformation" button that allows you to preview your integration, customize local look-ups, and filter properties.

Redesign

Overview Page Redesign

Goal: Increase engagement with brand content by providing a new look and removing outdated UI.

Ticket Feature

Tickets list
01

Create, manage, and maintain a list (or lists) of customer issues to avoid back and forth emails.

Edit ticket
02

Edit ticket details to add relevant information and to help keep details accurate.

our process03
Communication Center
Support Portal
New Comment

Design of comment section to allow clients to communicate faster with consultants.
Goal: Gather more information from the requester.

Recent Activity

Shows users integrations within the last 30 days. It also has user updates since they last accessed the app.