About Beckman Coulter:
Accelerating answers to your important questions
Our company’s heritage dates back to 1935, when Dr. Arnold Beckman founded National Technical Laboratories in California. That year, he sold 87 of his recently patented pH meters, a groundbreaking technology that could be used for everything from water quality testing to laboratory research.
Our mission today, which has changed little since 1935, is to empower those who are seeking answers to life’s important scientific and healthcare questions.
This mission embodies all our efforts to help customers get the data and answers they need, when they need them.
These answers may be important for expediting development of a new, life-saving biopharmaceutical, to help exonerate an innocent person based on DNA evidence, or to help monitor patients with chronic diseases.
If your life’s calling demands answers for these (or dozens of other) important endeavors, you need to know Beckman Coulter Life Sciences. No matter the type or scope of questions you have, we can help you get the answers you need—often faster than you thought possible.
Project Brief:
The goal of this project was to utilize prior designs, color guides, and branding in order to create a profession user interface for the Polaris Lab – PRO. I was provided with a prior design for the same UI that did not use components and did not match the style that Beckman was looking for. My job was to improve upon this design and provide the reasoning for better design choices. Below were the necessary components to create:
1. Navigation bar with 5 items.
2. Toggle switches for both DHCP and switching between IPV4 and IPV6.
3. Read only and write modes for input fields.
4. Functionality example with DHCP switch (some of the input fields change to read only / write)
Component Design:
The goal of this project was to create a professional UI design that not only meet all of the wireframe functionality requirements, but also utilize components in order to reuse elements and allow for efficient editing. Below is an example of how I created a component for the header element (created from separate button components). Each variant of the header element has a different hover state for the navigation bar.
Functionality Example:
In order to show how components can create easy functionality, I used the DHCP switch as an example and created a DHCP on/off variant that met the design requirements. The basic functionality was that when the DHCP switch is toggled, the information for most of the fields is auto-filled and the field is turned to read only.