214-636-4114 info@rubyredfrog.com
Select Page

Agile Development 

Scrum & Kanban

“Trent hit it out of the park with his UX solutions!”
Drager Product Group

Case Study

Dräger is an international leader in the fields of medical and safety technology. Dräger has been protecting, supporting and saving lives since 1889.

Target audience was hospital staff charged with ordering equipment and supplies.

Business challenge was that Hospital systems are ditching the distributor and contracting directly with manufacturers, while using their own storage and distribution channels. Drager’s existing distributor system is antiquated and not specifically targeted at US Market.

The problem we were tasked with was to assist Drager upper-management in creating a presentation focused on gaining acceptance for redesigning their existing website. The focus was how to let site visitors optimize the online process to more easily view, share, and purchase medical and other products across many categories.

My role was to create a persuasive plan to be presented to CEO and board aimed at gathering support to move forward with new system design.

Who did you work with? Laura Edwards, Sr. Manager for the Center of Excellence Marketing, North America, Draeger 

The solution was a proposed UX/UI design based on industry best-practices and research on a newly emerging business model based on online medical-sales. The final product was in the form of an interactive prototype built within Marvell, a prototyping application.

Invision Prototype

[et_pb_vertical_timeline title=”User-Focused AGILE Product Development Process ” _builder_version=”3.26.7″ text_font=”Montserrat||||||||” label_font=”Montserrat||||||||” headings_font=”Montserrat|600|||||||” headings_font_size=”22px”][et_pb_vertical_timeline_item timeline_label=”STEP 1″ use_read_more=”off” font_icon=”%%52%%” animation=”bottom” _builder_version=”3.26.7″ text_font=”||||||||” text_text_color=”#000000″ background_enable_color=”off”]


This is where it starts. First I have to stand back and survey the landscape; to understand the context of the project. If it is an ongoing project (not a new one), the history may be vital to know as well. From there I begin to gather information, usually first hand from the client, but also on my own as well. I’ll interview as many participants as possible – stakeholders, managers, team members, and of course end-users. Much depends on this initial step, because everything builds on it. Of course, it has to all be in line with the scope and the requirements of the project. In the end, it should touch on these three things:

  • Branding: How the organization presents or wants to present themselves
  • Perception: That I understand the problem correctly
  • Results: The impact of the needed solution on the business

[/et_pb_vertical_timeline_item][et_pb_vertical_timeline_item timeline_label=”STEP 2″ font_icon=”%%71%%” animation=”bottom” _builder_version=”3.26.7″ text_text_color=”#000000″]

To Do
If you’ve read about the Big Bang – that the universe began as just a single point, then expanded and stretched into all that exists – then maybe what I’m about to say will make sense, because that’s what my one page overview is. It’s that single point from which everything follows. In this small document, I try to understand the correlation between the requirements and features of the project – the timeline and ultimate goal. It needs to be as simple and easy to grasp as possible. A form similar to this may help. Creating this overview document often means reading between the lines, seeing the hidden, the subtle, and intangible issues that if not addressed, may endanger the success of the project.

[/et_pb_vertical_timeline_item][et_pb_vertical_timeline_item timeline_label=”STEP 3″ font_icon=”%%131%%” animation=”bottom” _builder_version=”3.26.7″ text_text_color=”#000000″]

In Progress
Personas are a valuable way to explore user needs, especially in an AGILE environment. I usually develop several personas – seven or eight to start – to explore all the needs of the user base. I often do user-community research (I don’t just make them up). Focus groups are great. Talking with your customer support is too (support staff are often there at the point of friction), or with product managers whose job is to understand the user community. This is the environment the product to exists in. It also helps create what I call empathy-points for the project. If needed, I’ll start with a very brief story of each character, which is the imagined person-type for this product. I’ll even give these person(s) a face, name, and age to make them resonate and pop off the page. Of course, these parameters should be relevant and based on the requirements of the project. For more on Personas, please see the Persona section on this page.

I have to keep in mind:

  • The frustration/pain points — This is the point of friction or the problem the character is facing that requires a solution.
  • Goals — The ideal reason why the user is choosing to use the app – and will continue using it.

[/et_pb_vertical_timeline_item][et_pb_vertical_timeline_item timeline_label=”STEP 4″ font_icon=”%%364%%” animation=”bottom” _builder_version=”3.26.7″ text_text_color=”#000000″]

These are little sketches to get a handle on what each screen will look like, in a purely functional way. I prefer hand-sketching wireframes instead of creating digital ones. It’s simply because they’re portable and fast; You can also experiment a lot.  The goal here is to figure out what UI components (and even styles) may be needed. I’ll often go looking for UI inspiration. Because it’s always easier as I have a clearer understanding of what components will be required. Great tools for wireframing are:

  1. Moqups.
  2. Wireframe.cc.
  3. TemplateToaster.
  4. Mockplus.
  5. Axure RP.
  6. Balsamiq mockups.
  7. Justinmind.
  8. Fluid.UI.

[/et_pb_vertical_timeline_item][et_pb_vertical_timeline_item timeline_label=”STEP 5″ font_icon=”%%108%%” animation=”bottom” _builder_version=”3.26.7″ text_text_color=”#000000″]

This may not be part of every designers process, because it involves look-and-feel. I try to break it down into 3 categories and then subdivide it into design components.

  • Design patterns — This is where I consider modern layout styles, usually needed for differtent devices. It’s good to identify them off the bat.
  • Color styles — Strictly speaking, color has nothing to do with the UI, nevertheless it helps me get a feeling for the brand and is a reference for color combinations.
  • UI components — Here, I focus on styling, not how elements fit together. For example, I may have a different selection of navigations and an entirely different selection for hero banner styles. Styling can give tension to a design, which brings it alive and makes it dynamic.

I often create Mood boards on Pinterest or within a folder on my desktop. InVision is also a good option for creating a Mood board, as well as a few online tools that have cropped up recently.


Example of personas


Based on the interviews/workshop I set up three personas and referred to them throughout the entire product development process.

  • How were personas developed? To develop the personas I relied on stakeholder interviews and online research. 
  • Why were personas needed? Personas were decided upon straight away due to the professional environment the system is used in.
  • What factors went into persona creation? I provided motivational factors for each persona such as the repetitive nature of the tasks, time constraints, budget, approvals needed, inventory system integration, and other factors.
  • This information was vital to gain acceptance from upper management.
  •  How did these personas affect design? They had enormous impact. For example, the “Share” component of the interface was suggested because of the timely need to gather approval for orders from supervisors. This feature was described as “hitting it out of the park” by VP of Marketing, after testing.

User Journey

A user journey is where we start to document the details of how we want people to complete a specific key task within a specific situation, such as documenting the steps in how a user can get a car insurance quote by entering some personal details. These user journeys detail the objectives of each page/step, key features & functionality to aid completion of the page, design hypothesis, user assumptions being made (which we then validate at a later stage with users, if not already done so, any technical considerations, brief sketch of the page and ideally a reference to relevant user stories.

I devised three versions for the user journey of the same task and tested them with prototypes to find out which one works the best.

Guiding Considerations:

  • How was the process determined: Online research, stakeholder interviews, end-user questionnaire, industry standards, surveys of existing systems.
  • How tested: Product managers and stakeholders owners were shown the new process by using Invision.

Customer Journey

Customer Journey (CX)

A customer journey – or ‘Experience Map’ to give it its specific title – is where we start to understand (via various types of quantitative and qualitative research) and plot a customer’s complete involvement in how they interact with the product or service across many digital and human touchpoints (e.g. from researching a product on a desktop, to buying via their mobile and phoning a call-center to make a claim).

In order to get to know the users’ behavior better, I created a Customer Journey Map.

Guiding Questions:

  • What was the whole buying process from the point where the user do not even know the product exists, to adoption?
  • What happens after using the product?
  • What were the main touchpoints where the user contacted with the service?
  • What were the main pain points for the user during the use of the service?
  • What functions, solutions did you find out to treat these pain points?

Customer Empathy

Card Sorting

Card sorting is a technique that involves asking users to organise information into logical groups. Users are given a series of labelled cards and asked to organise and sort them into groups that they think are appropriate. 
I decided on the main categories of the Drager project with a Card Sorting session, asking these questions:

  • What is customers main purpose?
  • What type of card sorting method did I work with? (Closed or reversed, online or in person)
  • How did the participants gather the information?
  • What kind of new navigation structure do you suggest?


I usually start the design process with low fidelity sketches. This is the way I iterate through many design options quickly.

Guiding Considerations

  • What was the main purpose of your sketches? Is it presenting, testing, brainstorming?
  •  How many different versions will you need?
  • Which version did you choose to go on with and why?


At the beginning of my design process I created wireframes for testing purposes.

Guiding Considerations 

  • Why was it useful to do this?
  • What kind of wireframes did you make? 
  • Low fidelity or high fidelity?
  • What tool did you use for this?
  • Did you use them for testing? 
  • How many iterations did you have?

Example hotels.com work for App Store

UI Design

Once I tested out all usability mistakes, I started designing the final screens in Sketch.

Guiding Considerations

  • What kind of visual style did you follow? (fresh, corporate, dark, light)
  • Did you follow any guidelines? (Material Design, iOS Style guide, etc)
  • What platforms did you design to?
  • Is there any little detail that you are really proud of?
  • What inspired you to use this style?


    We usually start with in-depth research to understand your business needs, then move to wireframes, sitemaps, prototypes, and development. This careful approach may seem overkill, but it goes a long way to assisting you in creating your content.  

    Time Management

    We fit our timeline to best fit our client needs and resources.

    Customer Participation

    It is vital that someone is an advocate for your customers. We are happy to take on this role, strengthening your message. 

    Market Research

    Initial market research is a vital part of any project. It insures high user adoption and satisfaction.

    Project Management

    We work closely with every one of our clients to insure all goals and other success criteria are met.