☞ Boxen
UIUX Design and Development of a huge-scale interface.
Executed with Javascript, jQuery, and Node.js.
Summer 2016, Oracle Corp Appslab Team.
Also on Medium

Over the summer, I interned at Oracle with the Appslab team after getting to know them at AT&T Hacks a couple months before. A team like this is a real anomaly in a mega-corp like Oracle — it deals specifically with prototyping and playing with new and emerging technologies and figuring out ways to use them to enhance the corporate experience. We took tools of play — VR, drones, gesture control, and whatever else is on the plate — and explored ways that they could increase, rather than drain, productivity in the workplace.

☞ Problem

To create an interactive prototype of a corporate usecase for a huge video wall. Wall of monitors provided, assembly required for software.

☞ Solution

Together with the various product and interaction designers in the Appslab, we found a valuable usecase for this technology in the form of a smart video wall acting as a dashboard. It would connect with various pre-existing Oracle APIs to display all sorts of information that are relevant in the day. Widgets like a Calendar applet, Map applet, and various data aggregation applets are interactive and meaningful.

I coded the main backbone of the system in Javascript and jQuery — the idea would be that it would run in a browser maximized along the entire screen. Fiddling with various touch and drag-drop libraries, I quickly constructed a backbone that allowed apps to be affixed along a grid of 3x3, to keep the programming and organization simple as well as to keep in mind the difficulty of working between bezels.

The project began with lots of brainstorming. Since my project is exploratory, self-contained, and would only be displayed at conferences and in-house with no outside use, this step was very important just for myself to determine what my whole summer would be devoted to creating. Product and interaction designers at Oracle were extremely helpful in this regard — they’re equipped with lots of user stories and personas that represent the integral userbase that Oracle serves.

Ultimately, we decided that we would be building a system that serves some use for a Sales Lead, a constructed identity named Casey Brown. He would enter every morning into his smart office, and his Boxen would greet him with a warm ‘hello’ and a daily debriefing — a calendar of events with actionable links, a scoreboard of his salespeople who report to him, a progress board of leads, and maps of the status of various sales theaters.

☞ Considerations

i. Big vs Small

The Appslab, and indeed, much of hyped tech, has generally focused on somewhat small interfaces. On watches and phone screens, the range of interaction lies within the bend of a finger and wrist. On VR experiences, the range of interaction can be the whole hand through the controllers. With Boxen, I had the unique opportunity to work with a person's entire wingspan.

Wingspan has a lot more variability between users than, say, hand size, so there had to be some way to make sure that as many people could use all the features. Widgets near the top of the screen can't be accessed by shorter people, and people might need to crouch to reach the bottom of the screen.

I created an in-between interaction mode to maintain accessibility. Widgets can be moved around, summoned, and deleted with a small control panel with labeled squares that mirror the positioning of the actual widgets themselves. This control panel is summonable to any point on the board with a quick double-tap. Anything on the control panel can also be pinched with two fingers to resize it in any direction, to make it take up, say 1x2 boxes, or 2x3, or even the entire 3x3 screen. This solution also solved the issue of dragging over the bezels between individual screens, as well as leaving the actions of dragging and pinching free for individual widgets to accept in their own box.

ii. Cross-platform

A major focus of this team is shared experiences across different platforms. While the screen is directly interactive with touch, users are also able to toss in applets from their phone or other smart IoT device, and even control the placement and size of each individual box through voice control.

With the help of my coworkers, the boxen accepts commands from cell phones, SMS, and voice control. It can open up any URL as a new widget, or some other preset widgets, through a simple RESTful API.

These two boxen, one 3x3 mounted on a wall and 2x3 on a table, can talk to each other.

iii. Aesthetic

To make this project especially eye-catching, I have it a super futuristic look — drawing influences from The Martian, Interstellar, and other sci-fi flicks to deliver a classically space-age interface, replete with semitransparency and a underlying, shimmering grid. It felt really good to flex a little design muscle.

☞ Thoughts

Boxen, codenamed Graceland, was exhibited at Oracle Openworld Exchange, attended by over 60,000 people. Today, it stands as the permanent centerpiece feature of the Appslab Smart Office.

All in all, this was an incredibly fun and interesting internship. Coding aside, the coworkers were genial and hilarious, the culture at this group was supporting and fun (a real surprise!) and the area was beautiful. I picked up a lot of skills with quick prototyping, user stories, and web app development with Node and jQuery, and made lots of friends along the way.