Ignition Desktop Launchers

Ignition Desktop Launchers

Overview

These cross-platform desktop applications are used to launch industrial applications by end-users. There are two distinct apps, one which launches the platform-level designer and one which launches any number of applications.

I led the design of these from concept to final UI deliverables and collaboration with the development team. The work was completed by me as an employee of Inductive Automation.

Details

Employed

60% Onsite

Desktop Application

2 months

2018

Pro_004Pro_004

After gathering the product requirements and doing initial research, I began this project with simple wireframes to work out the user flows and interaction design. Using an interactive prototype and low fidelity wires, I was able to share my ideas and direction with the larger team for discussion. 

Working in the lowest wireframe fidelity possible helps me to move quickly and communicate ideas with my team. I've found that using no color and even a terrible typeface like comic sans helps everyone to undersatnd that we're still in the ideas phase, so anything can be questioned and torn apart. No design is "sacred" at this stage.  

[unex_ce_button id="content_9a1n9hx3j,column_content_hbclqowzl" button_text_color="#57728a" button_font="bold" button_font_size="15px" button_width="full_width" button_alignment="center" button_text_spacing="2px" button_bg_color="#b2d7ff" button_padding="15px 60px 15px 60px" button_border_width="1px" button_border_color="#324e6d" button_border_radius="0px" button_text_hover_color="#b2d7ff" button_text_spacing_hover="2px" button_bg_hover_color="#324e6d" button_border_hover_color="#324e6d" button_link="https://sketch.cloud/s/m8Wr8/MbZGmw/play" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]WIREFRAMES[/ce_button]

Once the application(s) structure had been iterated on a few times and were accepted by my product owner and larger team, I moved forward into the interface design phase. 

Following the UI design guidelines I had established for this platform's Design environment, I was able to quickly reach a high level of design fidelity. 

[unex_ce_button id="content_wtukjp9lh,column_content_hbclqowzl" button_text_color="#57728a" button_font="bold" button_font_size="15px" button_width="full_width" button_alignment="center" button_text_spacing="2px" button_bg_color="#b2d7ff" button_padding="15px 60px 15px 60px" button_border_width="1px" button_border_color="#324e6d" button_border_radius="0px" button_text_hover_color="#b2d7ff" button_text_spacing_hover="2px" button_bg_hover_color="#324e6d" button_border_hover_color="#324e6d" button_link="https://sketch.cloud/s/51Rby/YElALe/play" button_link_type="url" button_link_target="_blank" has_container="" in_column="1"]UI PROTOTYPE[/ce_button]

The majority of the design to development handoff for this project happened in-person, via slack and through InVision's inspect feature. That said, some more complex interactions required design specifications. These included the "manual gateway input" flow and the interaction design of buttons. 

These applications replaced a legacy java web-start based system and helped to modernize the platform as a whole. They're more secure, future-friendly and accessible than ever before in their redesigned state. 

Pro_008-transPro_008-trans