Tips, Tricks, and Lifehacks for Online Educators
 
Make my idea! JoyScreen: Browser plug-in for native performance in HTML5 apps

Make my idea! JoyScreen: Browser plug-in for native performance in HTML5 apps

Computer keyboard
Computer keyboard (Photo credit: newfilm.dk)

In many ways, it’s crazy that we have multiple competing app stores to deliver content that works perfectly well on the web.

HTML5 has emerged as a great platform for rich applications on desktop and mobile devices, handling several features that were once only possible in native apps. Developers love building apps in HTML5, but users tend to favor native apps due to their zippy performance and customized controls. HTML5 has come a long way in providing native-like performance, but it’s got one ongoing Achilles heel– the browser– always gets in the way.

Apps are optimized to help you work quickly, and they contain rich keystrokes and gestures that match common features of the way the app works. The gestures, keystrokes, and other interactions for web-based apps can’t be customized to the work you do in that app because they are already designed to invoke features of the browser, not the app.

Native apps often provide a more natural interface between you and your content because they’re more free to customize the gestures you can use to control the app. When you’re in a browser, your swipes and gestures control THE BROWSER, not the application. This is a subtle distinction, but it makes a big difference on your user experience.

On touch-based devices, simple tasks like resizing pictures are clunky and challenging because your browser interprets your pinch gesture as a command to resize the page layout, not the elements on the page. A swipe from left to right might switch between your open browser tabs instead of swiping an email from your inbox to your done folder.

For example swiping from the right on Facebook’s native app opens a list of your friends you can chat with. Swiping from the right on Facebook’s webapp opens your browser history. It takes you out of your Facebook experience because the browser is always surrounding that experience. Sometimes you want this, but often you don’t.

Get the Browser to Fade Out

What if each page could load its own set of custom keystrokes and interactions to help you work faster and more comfortably, right when you load the page? Imagine having native-like control of browser-based apps using your own customizable gestures and keystrokes. Imagine a single command that tells the browser to stop acting like a browser (intruding on your app experience) and let the application be radically in charge.

I think this could be accomplished by a browser plugin (or built-in feature) that recognizes which website you’re on and loads an alternative set of keystrokes and touch gestures that override the browser’s default strokes/gestures. This would allow users to load and even customize the gestures they use to be productive on different sites without tripping over the browser’s built in features. This could make the browser’s chrome fade into the background and make HTML5 apps feel more like native apps to the user. It also has the potential for users to customize and share their own keystrokes and gestures for websites that don’t already support such events.

I imagine this being technically very similar to the Stylebot extension for Chrome, which loads custom CSS settings for various websites based on users’ specifications, and then lets them share those settings with a social community.

I have tentatively named this idea “JoyScreen” and will work on a few mockups that will demonstrate what it looks like in my head.

I would very much like to collaborate with technical people who could bring this idea to life with me as an open source project– I think this fits in nicely to Mozilla’s mantra that “the web is the platform” and may be a way to move us all closer to that ideal. Please hit me up on G+ if you’d like to collaborate.

 

 

Liked this post? Follow this blog to get more. 

Comments

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: