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)

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) No, coding in VI does not count!

Is There A Perfect UI Technology? -2 Short Answer: No

Is There A Perfect UI Technology? -2 Short Answer: No Thank 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 -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?

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? Half a billion smart phones are sold each year worldwide. Some of them can even talk to you!

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? 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 -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.

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.

Some Good UI Technologies 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 Java (Swing, SWT, and JavaFX) Google Web Toolkit (GWT) Microsoft Visual Studio Adobe Flash Builder HTML 5 and JavaScript Unity3D

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

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

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 -3 November 9, 2011, Adobe announces Flash won’t go mobile…

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

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

Adobe Flash Builder -3 November 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.

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

Some Good UI Technologies 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

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

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 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

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

HTML 5 and JavaScript -3 So it is inevitable that HTML 5/Javascript will take over the world wide web, crushing all other competition 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

Some Good UI Technologies 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?