BRANDING DESIGN
This is a branding deck I put together for Starlyte Imaging. In order to create the cyberpunk look, I wanted to make bold san serif fonts to signify a brutalist take on iconography. I wanted the fonts to be strong and the images to be putting functionality and clarity at the forefront. Most Life science branding tend to use blues and greens in their branding. I wanted to make something that stands out as the opposite.
ONE PAGE CARDS FOR SHOWS
ICONOGRAPHY OF STARLYTE SUPPORTED COMPONENTS
Each Component was designed to be a stylized logo. While this is an evolving style, I have various levels of detail in these icons and some are more complex than others. I plan to edit these and refine these as time goes on to increase its consistancy but currently it works for what it does.
SOFTWARE CASE STUDY
Nebula by Starlyte Imaging is an image acquisition software that operates multiple hardware components for fluorescence and confocal microscopes. I designed the Logo, branding, product vision and UI UX. Before joining Starlyte, Jacob Gewerth and I worked on xPloration for OmniAb. You can see he was familar with my process. Starting with product vision. Immediately Jacob, Austin and myself shared a deep love Cyberpunk graphics and branding. We wanted to be different from our last venture and make something that is clearly "US". Influenced by games and music like Starfield, Cyberpunk 2077, and 80's Retrowave, I took a stab oat the design.
CONFIGURATION
The first thing analyzed and identified was the USER's pain point of setting up their configuration. In read a text based device list. Lets make that "SHOW DEVICE" area the hero of the configuration process. Lets make it highly visual. Our Scientist Persona are not IT experts.
PERSONAS
Scientist/Microscope Expert -CONFIG/MICROSCROPY WORK
Hardware Service Tech -CONFIG
Scientist/USER - MICROSCROPY WORK
Hardware Service Tech -CONFIG
Scientist/USER - MICROSCROPY WORK
PROCESS USING FIGMA
Here I am working with Jacob on the transitions and flow of setting up a configuration on our organized SITE MAP. I use figma to plan out the broader designs. I am using modal dialogs to edit the configurations for adding new devices to the work space by answering a few question in the entry fields. Jake and I have been working together for years at this point so our conversation is very limited. :)
IMAGE ACQUISITION
Here we have a stark difference in the UI between our CONFIGURATION PATH and our IMAGE ACQUISITION PATH. This is because the USER configures their machine profiles while the laboratory light are on but using a microscope is generally in a dark room so not to be influenced by outside light.
COMPONENTS - ATOMIC LEVEL
I designed these components with the vision of using Glassmorphism as homage to the glass plates used in traditional microscopes.
Collapsing menu selection.
Organism level components to represent HARDWARE DRIVER types to add to your CONFIGURATION SETTINGS.
MODAL UI DESIGN
COLLAPSING TABLES UI
Ecosystem Components - MODALS that repeat patterns.