noaa's earth system research lab in boulder, co the quest for the perfect user interface...

NOAA's Earth System Research Lab in Boulder, CO

The Quest For The Perfect User Interface Technology

February 23, 2012

Presented by Jeff Smith, Julien Lynge, and Eric Hackathorn

Is There A Perfect UI Technology? -1

Something that supports everything from sophisticated animation and 3D Rich set of GUI widgets Mature technology that is largely bug free and likely to be around in

another 5 years Runs on Windows, Mac, Linux, iOS, Android, web browsers Scales well (in the software engineering sense of maintainability)

from small apps to large ones with > 100,000 lines of code Includes a powerful and easy-to-use integrated development

environment (IDE)


Something that supports everything from sophisticated animation and 3D Rich set of GUI widgets Mature technology that is largely bug free and likely to be around in

another 5 years Runs on Windows, Mac, Linux, iOS, Android, web browsers Scales well (in the software engineering sense of maintainability)

from small apps to large ones with > 100,000 lines of code Includes a powerful and easy-to-use integrated development

environment (IDE) No, coding in VI does not count!


Short Answer:

No


Short Answer:

NoThank you for your time today.

Any Questions?

Some Good UI Technologies

Java (Swing, SWT, and JavaFX) Google Web Toolkit (GWT) Microsoft Visual Studio Adobe Flash Builder HTML 5 and JavaScript Unity3D

Java Swing -1 Java Swing (the artist formerly known as Java Foundation

Classes or JFC) is the oldest of the Java GUI frameworks Okay, technically the Abstract Window Toolkit (AWT) is the oldest,

but that API was deprecated when Seinfeld was still on NBC Technical detail: Swing builds on top of AWT and leverages its ability to interact

with the OS to access the mouse and keyboard

Swing includes a rich set of UI widgets, although the base components are not very flashy

Java Swing -1 Java Swing (the artist formerly known as Java Foundation

Classes or JFC) is the oldest of the Java GUI frameworks Okay, technically the Abstract Window Toolkit (AWT) is the oldest,

but that API was deprecated when Seinfeld was still on NBC Technical detail: Swing builds on top of AWT and leverages its ability to interact

with the OS to access the mouse and keyboard

Swing includes a rich set of UI widgets, although the base components are not very flashy

Platform independent (100% Java), following the model-view-controller pattern to decouple the data being viewed (often modeled as Java classes) from the UI code that is viewing it.

Very flexible, easy to extend existing components and derive new looks and behaviors

NetBeans (free) and IntelliJ IDEA (not expensive) are great IDEs for Swing development

Of course, your users must have a Java run time environment (JRE) installed in order to run your application

Java Swing -2 (NetBeans)

Java SWT -1 Standard Widget Toolkit

Most SWT developers use the Eclipse rich client platform (RCP) for developing applications

Unlike Swing, SWT uses native widgets It doesn’t run everywhere Java does, but it does run in

Windows, Linux, and Mac OS/X Eclipse (free) is a great IDE as well

Disclaimer: I have used Eclipse on server side

projects but have done no significant SWT projects

JavaFX Can use JavaFX script which gets compiled down to Java

byte code For someone unfamiliar with Java, JavaFX script is easier to learn A learning curve, however, for seasoned Java coders. JavaFX 2.0

includes new APIs that don’t require scripting (can use Java code)

Better animation support than Swing or SWT Runs anywhere that Java runs

JavaFX Can use JavaFX script which gets compiled down to Java

byte code For someone unfamiliar with Java, JavaFX script is easier to learn A learning curve, however, for seasoned Java coders. JavaFX 2.0

includes new APIs that don’t require scripting (can use Java code)

Better animation support than Swing/SWT Runs anywhere that Java runs Good for apps imbedded in web pages (in a sense, an

alternative to Flash for Java coders) I haven’t used the new version 2.0, but I found that my 1.3

apps loaded somewhat slowly on web pages (~10 seconds) JavaFX support integrated into NetBeans If I were starting a new Java GUI app that needed some

pizzaz, I would give serious thought to JavaFX

Future of Java in GUIs -1 Of course, your users must have a Java run time

environment (JRE) installed to run your application. Java runs on many operating systems

Future of Java in GUIs -1 Of course, your users must have a Java run time

environment (JRE) installed to run your application. Java runs on many operating systems

According to Oracle, 3 billion machines run Java. Apparently,

Java is taking over the world and runs everywhere. Take that,

Apple and Microsoft!

Future of Java in GUIs -2 Unfortunately for Java, there is a tiny, niche market where

Java does not run. Perhaps you’ve heard of it?


Java does not run. Perhaps you’ve heard of it? Half a billion smart phones are sold each year worldwide. Some of

them can even talk to you!


Java does not run. Perhaps you’ve heard of it? Half a billion smart phones are sold each year worldwide. Some of

them can even talk to you!

Hundreds of millions of tablets are also sold annually, and they are growing more and more capable

Future of Java in GUIs -3 While there is Java ME and the promise of Java on smart

phones, at last count, there were 11 Java ME phones in existence in the world (down from 12 last month)

Future of Java in GUIs -3 While there is Java ME and the promise of Java on smart

phones, at last count, there were 11 Java ME phones in existence in the world (down from 12 last month)

Bottom line: Java does not appear to be heading to smart

phones or tablets within any reasonable geologic time scale

Future of Java in GUIs -4 On the other hand, if you are writing an app for a niche audience and don’t need the app to work

on mobile devices, then Java is fine. Java Web Start is a great for deploying Java applications to the web. User can download/run

your app with one click and receive automatic updates when you push out new versions.


Java (Swing, SWT, and JavaFX) Google Web Toolkit (GWT) Microsoft Visual Studio Adobe Flash Builder HTML5 and Javascript Unity3D

Google Web Toolkit (GWT) -1

For building web browser applications The promise:

write your code in Java (hooray, Java) and GWT will “compile” down your code to the proper HTML and Javascript to run on any web browser

Google Web Toolkit (GWT) -1

For building web browser applications The promise:

write your code in Java (hooray, Java) and GWT will “compile” down your code to the proper HTML and Javascript to run on any web browser

The reality: most of the code works, but you still have nagging problems where

the Javascript it generates works on one web browser (like IE) but not another (like Firefox).

I recommend GWT if you love writing Java code, hate writing JavaScript (and who doesn’t?), and yet need to produce a JavaScript-based browser application

GWT is a plugin for Eclipse

Google Web Toolkit (GWT) -2 Here’s a GWT app that I co-developed with Evan Polster that

uses the Google Earth browser plugin to display FIM data

We wrote the code for this panel in Java

Later, I’ll show you the new, Unity version of this application

Some Pretty Good UI Technologies


Microsoft Visual Studio They give away a free version (VS Express) Not used much in the Earth sciences field, but millions of

Visual Studio developers are out there Can create Windows and Silverlight (browser plugin) applications in

multiple .NET framework languages including Visual Basic Visual C#

C# is very similar to Java and can be used in Unity3D development (more on that later)

Visual Studio is a powerful and mature IDE

Adobe Flash Builder Flash is a powerful web technology (and it now

supports 3D and better leverages GPUs)

Adobe Flash Builder Flash is a powerful web technology (and it now

supports 3D and better leverages GPUs) Okay, Flash is best known for annoying banner

ads on websites.

Flash banner

on NYTimes

Adobe Flash Builder -1 Flash Builder can be used to create complex, forms based

applications that run in all web browsers that have the Flash plugin.

Version 4.6 can now compile native applications for iOS (iPhones and iPads)

Flash Builder is a great IDE for designing forms, writing object oriented code (ActionScript is similar to Java)

Adobe Flash Builder -1 Flash Builder can be used to create complex, forms based

applications that run in all web browsers that have the Flash plugin.

Version 4.6 can now compile native applications for iOS (iPhones and iPads)

Flash Builder is a great IDE for designing forms, writing object oriented code (ActionScript is similar to Java)

Doing slick animations in your applications is a breeze (don’t need to worry about threading issues as it is all taken care for you by the Flash player)

Lots of video tutorials on the Adobe website showing developers how to do various things in Flash

Vibrant user community (easy to Google for answers when you are stuck on a problem)

Adobe Flash Builder -2 Integrated and easy debugging, refactoring No browser specific code to write! Great form designer

Perhaps the perfect tool for creating browser applications!

Adobe Flash Builder -3November 9, 2011, Adobe announces Flash won’t go mobile…

Adobe Flash Builder -4 No, Flash isn’t dead, but it isn’t looking nearly

as formidable as it once did.

Adobe Flash Builder -4 No, Flash isn’t dead, but it isn’t looking nearly

as formidable as it once did. On the other hand, my take is that on the desktop,

Flash will continue for some time. It is already a popular platform for web games (with GPU

support and 3D). It is much faster than HTML 5. Like Java (which has no real mobile devices support), Flash

desktop browser apps will likely find a niche for some time Even Unity, which we’ll discuss later, now supports Flash so

Unity games can play within the Flash plugin on a variety of desktop platforms


Java (Swing, SWT, and JavaFX) Google Web Toolkit (GWT) Microsoft Visual Studio Adobe Flash Builder HTML5 and JavaScript Unity3D

HTML 5 and JavaScript -1 HTML 5 can do video and other things that Flash can do,

doesn’t require a plugin, and works on mobile devices Different browsers have different levels of HTML 5 support Chrome was best, then Firefox, then desktop Safari, then IE last Surprisingly, as of Oct 12, 2011, the iOS Safari browser was slightly

more HTML5 compliant than the Safari desktop browser (according to InfoWorld)

HTML 5 and JavaScript -1 HTML 5 can do video and other things that Flash can do,

doesn’t require a plugin, and works on mobile devices Different browsers have different levels of HTML 5 support Chrome was best, then Firefox, then desktop Safari, then IE last Surprisingly, as of Oct 12, 2011, the iOS Safari browser was slightly

more HTML5 compliant than the Safari desktop browser (according to InfoWorld)

There are some good Javascript libraries out there. Ones I’ve looked at but know little about: JQuery, Dojo, ExtJS

Others that I know even less about Chrome Frame and MooTools

HTML 5 and JavaScript -2 Why would you develop in HTML 5/Javascript?

You need a browser app that has no entry barrier (requires no Java, Silverlight, or Flash plugin, etc.) E-commerce. Amazon.com will want anyone with a valid credit card

to be able to buy porcelain yard gnomes from their website




You need the finest control (maximum feature set) possible in a browser application For example, Gmail is amazing

You’d rather spend quality time writing special Javascript code for each browser than go home to your spouse at 5 pm Different browsers will still have different levels of HTML 5/Javascript support




You need the finest control (maximum feature set) possible in a browser application For example, Gmail is amazing

You’d rather spend quality time writing special Javascript code for each browser than go home to your spouse at 5 pm Different browsers will still have different levels of HTML 5/Javascript support

If I were starting a browser application today that needed to run on many platforms (including iOS), I would probably go with HTML 5 Adobe Edge is a slick tool that enables you to create Flash-like

animations for HTML 5. Adobe Dreamweaver also supports HTML 5. Many tool developers are ramping up support for HTML 5

HTML 5 and JavaScript -3 So it is inevitable that HTML 5/Javascript will take over the

world wide web, crushing all other competition



Wait! Enter a new competitor Google Chrome Native Client (NaCl) Runs native code in Chrome on Windows, Mac,

and Linux Much faster than HTML 5, direct access to

computer hardware (including disk), has its own sandbox security model

Potentially a great platform for high performance apps and games

Currently apps must be distributed in the Google Chrome Store



Angry Birds now runs natively inside Chrome!

Wait! Enter a new competitor Google Chrome Native Client (NaCl) Runs native code in Chrome on Windows, Mac,

and Linux Much faster than HTML 5, direct access to

computer hardware (including disk), has its own sandbox security model

Potentially a great platform for high performance apps and games

Currently apps must be distributed in the Google Chrome Store


Java (Swing, SWT, and JavaFX) Google Web Toolkit (GWT) Microsoft Visual Studio Adobe Flash Builder HTML5 and JavaScript Unity3D

Unity3D -1 Unity is a commercial game engine that excels at rendering

3D (and 2D) scenes Unity applications can be deployed to Windows, Mac, iOS,

Xbox, Wii, and the web (through the Unity web player) >800,000 registered developers Good community support and documentation, tutorials

Unity3D -2 Unity is also good for 3D data visualization Julien, Eric, and I have written a Unity-based 3D spinning

globe application for displaying environmental data (source code written in C#)

TerraViz showing NOAA satellites, NORAD space junk, and active fires data

Unity3D -3 Unity allows us to model the world and space in 3D By leveraging a commercial game engine, we’re exploiting

the enormous effort that has gone into optimizing the display of millions of polygons on GPUs

When we display global G9 (30 km) model data (FIM) in TerraViz, we can display 2.6 million polygons and rotate the globe with no delays As a comparison, Google Earth chokes at around 10,000 polygons

(KML)

Any Questions?

[email protected]

[email protected]

[email protected]

noaa's earth system research lab in boulder, co the quest for the perfect user interface...

Documents

java swt

java classes

swing development

keyboard swing

swing builds

java foundation classes

perfect ui technology

netbeans slide