OVERVIEW

line

JT2Go

UX/UI • Mobile Applications

JT2Go is the industry leader for viewing 3D JT data on mobile and desktop devices. JT data can be generated from nearly all the major CAD/CAM/CAE tools available in the industry today. 

My role was to provide ideas that delivered a good user interface and design experience across all mobile platforms (Windows Surface Hub & Hololense, large & medium size tablets and mobile phones).

Role: User Experience & User Interface Design
Tools: Adobe Photoshop, Illustrator & AfterEffects

surfacehub

DESIGN PROCESS

line

Microsoft launched the Surface Hub in 2015. Prior to this, they asked us to develop a JT2Go (the existing Siemens application) mobile application to demonstrate on the Surface Hub for its official release.

I started by understanding the application’s core users and its features & functionality to begin forming ideas of how I could extend its capability to the Surface Hub. At the discovery stage, the technical specifications of the Microsoft Surface Hub were not yet available such as DPI, screen resolution and sizes. At the time, we were only informed that Microsoft planned to release a 55" and an 85" Surface Hub in the middle of 2015.

My team and I started our initial concepts with whiteboards and sketches, which were then transformed into a UX Diagram Flow and Wireframes. We presented our work to the stakeholders. Once we received feedback and approval, I started with the visual design of JT2Go’s User Interface and Icon Design, in addition to branding.

UX DIAGRAM / FLOW CHART

jt2go

Call Out Interaction

WF_Hub_v5_Page_04
WF_Hub_v5_Page_05
WF_Hub_v5_Page_07
WF_Hub_v5_Page_08
WF_Hub_v5_Page_09
WF_Hub_v5_Page_10

Interaction on Start Screen

WF_Hub_v5_Page_12
WF_Hub_v5_Page_13
WF_Hub_v5_Page_14
WF_Hub_v5_Page_15
WF_Hub_v5_Page_16
WF_Hub_v5_Page_17

Interaction on 3D Viewer

WF_Hub_v5_Page_21
WF_Hub_v5_Page_22
WF_Hub_v5_Page_24
WF_Hub_v5_Page_25
WF_Hub_v5_Page_26
WF_Hub_v5_Page_31
WF_Hub_v5_Page_32
WF_Hub_v5_Page_33
WF_Hub_v5_Page_34

User Interface Design for 85" Microsoft Surface Hub

55HubHome-01-FloatingCover-01
55HubHome-01-FloatingCover-01-2
55HubViewer-04-Structure-2
55HubViewer-03-LinearMenu-100-DockLeft
55HubViewer-04-Structure-2-101-SingleDialog-DockedLeft
55HubViewer-05-ModelView-100-SingleDialog-Floating

THE CHALLENGE

line-white

At the beginning of the discovery stage, the specification for the Microsoft Surface Hub wasn’t clear. After the first round of design, I had to print out the widgets and dialog designs along with different font sizes and icons to ensure the physical sizes were legible on the screen. I had to ensure the compatibility of JT2Go to both small to large mediums. As in many cases, this is a major challenge. Not all design concepts that are valid on larger screens can be implemented on the small screen. Devices can differ in size, resolution, type of display, physical interaction methods, and performance.

Options
resolution_chart_1
nvidia-geforce-gtx-battlebox-batman-arkham-origins-4k-versus-hd

TRANSLATE DESIGN TO ALL MEDIA

line

 In the middle of 2015, our team launched the JT2Go Universal Window Platform version along with Microsoft Surface Hub releases. The application was pre-installed on every Surface Hub in the Windows Stores for demo purposes in their display areas. The launch was a huge success and we received a lot of positive feedback.

Later in 2005, Microsoft requested that JT2Go be compatible with all small to large UWP, iOS and Android mobile tablets and smartphones. I started to translate the design to all media and to provide designs to each platform.

jt2go

User Interface Design for Smartphone

PhoneViewer-02-LaunchMenu-Lanscape
PhoneViewer-03-LinearMenu-Landscape-1
PhoneViewer-03-LinearMenu-Landscape-2
PhoneViewer-02-LaunchMenu-Portrait
PhoneViewer-03-LinearMenu-Portrait-2
PhoneViewer-03-LinearMenu-Portrait-1

User Interface Design for Medium & Large Tablets

PROViewer-03-LinearMenu-1
PROViewer-03-LinearMenu-2
PROViewer-04-Structure-2
PROViewer-05-ModelView
PROViewer-06-Markup
PROViewer-07-PartProperties-1
PROViewer-07-PartProperties-2
PROViewer-08-PMIFilters-1
PROViewer-08-PMIFilters-2

Anita Chang
© Copyright 2006-2022

If you want to see more of my work or you'd like me to provide input to your future project, please do not hesitate to drop me a message. 
+1 (949) 542-6482
hello@anitachang.com