Wednesday, December 16, 2015

Announcement: best effort grades up!


Our best effort grades are up! Please have a look and let us know if you see any problems.

Changes from here on out should be few.

Professor Watson.

Monday, December 14, 2015

Peer Evaluations

Hi folks,

Peer evaluations are available here, if you wish to evaluate your team members. You are not required to do this.

Have a good break!

Friday, December 11, 2015

Project: Nonlinear Learning


One of the main focuses of our nonlinear learning project was to incorporate mind maps for nonlinear learning, and use p5.js for videos with interactive elements. We spent over 2 months exploring the different aspects of the Go.Js library (mind map) and the p5.js library (interactive videos), and this report will highlight our findings and opinions.


Linear learning, as found on course sites such as moodle exhibit a very rigid type of learning, where people go from topic A to B, then to C. Nonlinear learning allows students to navigate through different topics at their leisure, while providing the instructor the tools to guide them in the right direction.

Future Work:
  • Add more immersive elements to mindmap (different sounds for different actions)
  • Allowing mindmap changes to be directly saved to the html file
  • More tools for instructors who are not proficient with coding (interfaces for non-technical users)
  • Incorporating whole course web pages into mindmap (moodle)
  • Tracker for most visited videos, favorites list
Video Demo:
Our Site:
Github Repo:
User Feedback and Evaluations:

Report of Go.Js and p5.js utility

User Manual:
orites list

Project: FuturePres1


FuturePres1 - Final Deliverables


  • Felipe Sousa de Andrade
  • Zachary Butler
  • Bada Kim
  • Hussein Koprly
  • Veronica Sigler
  • Linda Vue


Create presentations that enable greater interactivity between the audience and the presenter.

The Core Problem the App Solves

We created an example of an interface that allows users to display more interactive and engaging presentations than is traditionally available through Microsoft Powerpoint. Our focus is on the guided communication scenario, with the goal of improving audience participation and non-linear structure.

The Madness Behind the App

Our application utilizes the following tools:
  • Bootstrap
  • JavaScript
  • jQuery
  • PHP
  • MySQL
The tool is a web-based blueprint-dashboard of a presentation that will allow users to navigate the presentation in a nonlinear manner. Each panel on the dashboard represents a part of the presentation. After clicking on a tile, the viewer will either be shown information, or another set of tiles representing subcategories. This allows the presenter the flexibility of nesting information into categories for easier navigation, rather than having dozens of tiles on the top level.

As indicated above, there are two views: the audience and presenter view. The audience view shows the presentation itself and allows the audience to ‘like’ a page, as well ask questions.  The presenter view shows statistics of the site, such as the page that has the most views and the most liked site. The presenter view also shows questions from the audience in the presenter panel at the bottom of the site.

An additional feature of the website is that users can participate in the presentation without being present, allowing them to get the full presentation experience anywhere.

Unfinished and Future Work

The tool is currently use-case specific for a Zoo and showcases functionality and capabilities that would be available to presenters. We do not currently have a tool that would allow users to create their own presentations as this project is a demonstration of what the tool could provide in the presentation realm.
There is currently a distinct presenter and audience view that allows for a QA-like interaction. Currently, the audience is able to submit questions, however the tool is limited in that the presenter is only able to answer verbally (this is sufficient for our project because we are implementing for a use-case specific scenario of a live Zoo presentation). That being said, a future goal is to incorporate an answering system such that the presenter may respond directly to the audience, or to have the questions and answers viewable to the audience as a whole.
We were also unable to provide multimedia support as listed in our project proposal due to time limitations.

Working site


Github Repo

Project Evaluation


Project FuturePres Team 2

Team Members: 

  • James Davis
  • Michael Ivanov
  • John Nixon
  • Benjamin Drury
  • Alexander Richardson
  • Quinton Chappell


Creating a new way to present a presentation in a non-linear model to make presentations more intuitive and exciting.


Presentations follow a linear path from one slide of information to the next which offers very little flexibility for the presenter and can also be dull for its audience. The idea of FuturePres is to create a new way to present data in a non-linear model to improve the experience of presentations for the presenter and his/her audience. For our implementation we focused on legal cases where lawyers have to record data and present them in a court of law. The website is split into four different categories: People, Places, Evidence, and Events. These are used to store the data from cases into the sstem to represent later. Once Data is stored onto the system the data is linked from one to another by connecting factors of other categories. Using this the presenter can move from one piece of data to the next by simply clicking on a connecting factor and guide the presentation. A timeline is also implemented in the View section to show events on a day to day, week by week, or even year by year selection.

Future Work:

  • Extra Features
  • Comments
  • User log ins
  • Data Collection/Database expansion

Video Demo


Demo Server

GitHub Repository

Projects: Tilt-A-Story

Tilt-A-Story Project Description

Tilt-a-story is an interactive picture book to inspire children to read.

Core Problem:
Children today no longer read books. Instead, they spend most of their time glued to their phone and ipads. By introducing classic childhood stories and fun learning games, children that use our program will be able to embrace the same learning that comes from reading books. The best part is, they think they’re just playing a fun game!

How it Works:
To make Tilt-A-Story we used javascript, canvas and html. By using these tools our webpage can run on more browsers. The child can interact with the story in two ways. The first way is to tilt the device to move the character around the screen. The second way is by using the touch screen to press buttons. Both methods can be mixed and matched as needed by the story writer/designer.  

Future Work:
In the future we plan to increase the user experience by adding more sounds and animations.  We would like to add gifs instead of static pictures to increase the overall visual of the app.  Since Tilt a story brings together multiple stories for children to learn from, we need a way for parents to “buy” a story and add it to the application. We would also like to create a “world builder” application so that designers can easily create their own stories and post them to our store.  

Extra Credit:
On top of our completed Picnic Adventure story, we have also finished our Billy’s Treasure Hunt story that capitalized more on telling a story with visuals. The player takes on the role of Billy and his search for treasure, along with picking up useful tools along the way.

  • A link to the working site
  • Video
  • Github Repo
  • Presentation

  • Project Evaluation

Project: Sharks

Citizen Science - An initiative to enable everyone to participate in a scientific process.


We would like to provide students the opportunity to experience the process of finding, measuring, and doing statistics on shark teeth, without needing to acquire expensive supplies.  We want to create a "virtual fossil dig" which will allow students to get a similar experience by through their browser.

How it Works:

From the homepage, users can click on the "Start Digging!" button to be directed to the main game panel.  15 Shark teeth will be randomly scattered across a background of "fossil dirt."  Not all of the dig area is visible at once, so users will need to scroll around using the arrow keys or scrollbars.  Once a user sees a tooth, they can click it, at which point it will disappear from the game window and reappear in an inventory panel.  Once all 15 teeth have been discovered, the user can progress to a measurement page where they try to fit each tooth into the smallest circle that completely encloses it.  Once all teeth have been measured, the user progresses to a statistics page, where the size distribution of the teeth they have measured is compared against the size distribution of all of the teeth in the database.

Future Work:

  • Add an "I give up" button which highlights remaining teeth so that they can be found
  • Zoom in/out functionality 
  • Better interface
  • More backgrounds
  • Provide more information about the shark teeth and sharks they came from
  • Class / group functionality - compare your teeth statistics against the entire class

Demo Site




Created By: 

Remington Campbell, William Pruett, Eric Anderson, Daniel Alley, Kevin Reed, Derek Schreiner

Project: Seniors

Resources for Seniors, Inc

Accessible information for Senior Citizens at a click of a button



In order to best cater to the needs of a growing Senior Citizen presence in North Carolina, the Resources for Seniors, Inc website was redesigned in order to accommodate additional functionality and facilitate the process for users to view, save and print information about companies related to their interests.


Resources for Seniors serves senior and disabled adults in Wake County, NC, by providing home and community-based services and information so that they can maximize their choices for independence, comfort, safety, security and well-being. We provide information and support for decision-making, and also direct services such as home care, adult day care, senior centers, home repair, and more. We are committed to excellence in service and care for individuals and their families. In particular, the project listed here allows web access to all information that Resources for Seniors, Inc provides in a user friendly, intuitive manor on a variety of devices.

Future Work:

  • Frequent updates of Company information on the Webpages
  • Deployment of new PHP stack onto the Web Server


Eric Bolender, Thomas Boop, Arthur Harris, Robert Lodico, Jacob Rose, Miles Wells

Thursday, December 10, 2015

Project: SAS Team Two

CSC 342 Sas Team 2 Project Description

Web application demonstrating different ways to animate the transition between data and a graph.

Problem to solve: Transitions from data to graphs are often clunky and hard to follow, if they even exist at all. The goal of this web app is to demonstrates ways for these transitions that are smooth and easy to follow.

How it works:
This application used a simple user interface consisting of an area for the data and an area for the graph. It also has a side bar that allow the user to choose which type of animation and transition to display.

Most of the transitions are done with the animate function in jquery, where we can decide where to move elements and how much to expand or compress them. The data for the demo is coded in an array for ease of access. Also, we used p5.js for our pie and doughnut chart. And finally, the animations themselves are done with a setInterval function to make all the timing work out properly.

Unfinished and future work:
-Finding ways to transition to other types of graphs.
-Implementing the transitions with larger data sets
- Being able to upload your own data set
- Coming up with different animation styles

Link to site:




Michael MacKrell, James Schaefer, Connor Patterson, Jose Chavez, Philip Jones

New Kind – We’re Looking for a Web Development Intern

Project: CodeArt

LENT - A project that turns library technology into art.



How to combine useful data about Hunt Library's Tech-Lending resources with digital art and sound.


A project to turn library technology into art. Users are able to see a visual representation of the technology that is currently available to be checked out at Hunt library in the Immersion Theatre. On the left is a legend that allows the user to see how many of each item is currently checked out, as well as a key that shows what each shape in the visualizer represents. On the right is the visualizer - a unique way to display the data about what technology is currently available and checked out from the library. The purpose of the project is to find a way combine a useful data with art, as part of NCSU Hunt Library's CodeArt Competition.

Future Work:

  • System Testing within the Immersion Theatre
  • For every 10 or so minutes, allow each individual sound to provide a "roll-call" along side an animation, so that viewers could see which object is associated to which device
  • Convert 3D objects to three.js
  • Allow the aesthetics of the visuals and sound to change depending on the time of the day
  • Update the "Castle" so that we have different variations showing up on the map
  • Add Camera/Tilt Perspective to the map space
  • Change mechanism in which the chart is currently being loaded, so that a Timout doesn't need to be used 
  • Allow extendability with loading objects, for easy inclusion of new devices

Link to Video

Link to Live Working Demo

Link to Presentation


Created By: Cameren Dolecheck, Tori Santonil, Filip Kolev, Zane Hissom, Nicholli Bernard, Kamaria Hardy

Spiral Sleepwalker

Project: Spiral Sleepwalker

Team members: Abbey Lancaster, Aoyi Li, Kai Ma, Nicholas Waked, Ethan Swartzentruber and Jennifer Wagman

Tagline: Gravity-Based Mobile Platformer

Developing a web based mobile game that reads data from motion sensors on smartphone or tablet.

We wanted to create a native mobile game experience while the user was actually playing a web based mobile game. We used p5.js to implement all of the game's graphics, including a gravity oriented mechanism that allowed the user to manipulate the sleepwalker in the game. Various levels are implemented, with varying amounts of difficulty. The amount of monsters increases as the player moves to higher levels, and the maps become more difficult to navigate.

Future/Unfinished Work:
The game still has extreme performance issues on Android, we expect that switching libraries would make this better.
Implementing more levels
Developing a tool for non-programmers to create levels

Link to Working Site
Link to GitHub
Link to Video

Wednesday, December 9, 2015

Friday's NexUX meetup with Emil Polyak - 3:30pm at Hunt Library!

As before, 1% extra credit for coming.

Unfortunately we could not swing the beer yet. As you might imagine, there is some bureaucracy :-(

Webclass, we'll just be a bit late in arriving.

Come to Friday's nexUX Meetup! @ Hunt Library, December 11th @ 3:30p
View this email in your browser

Come to the nexUX Meetup!

With Emil Polyak, professor of art and design at NC State

A presentation of cross-disciplinary experiences

In this informal presentation at a special time, Emil Polyak will share with us some of his work that breaks down the barriers between art and technology, and will also hold a Q&A after the presentation. Please bring your questions to the event!

Emil Polyak is professor of art and design at NC State. With degrees in cross disciplinary art and design as well as telecommunications engineering. The experiences he creates attempt to break boundaries between technology and art by focusing on play, interactivity and making. Emil will present several of his projects, including virtual puppets exhibited at SIGGRAPH, and his current work in the area of virtual reality.

As always with our meetups, this is not a "sit back and listen" meeting, but a chance for us to bring together a cross disciplinary group of people to think about the relationship between UX, technology, and art. Mostly though, we'll get to know one another, and have some fun.

Please RSVP using the button below. 

Also, please forward this email to whomever you think might be interested!

Special thanks to our 2015-16 sponsors - LexisNexis, Deutsche Bank Global Technologies, the ePartners Program and the NC State Engineering Foundation.

RSVP to this Meetup


Friday, December 11, 3:30pm


nexUX Meetups take place in the James B. Hunt Library on NCSU's Centennial Campus. Events will be held in the Duke Energy Hall of Hunt Library, with a few exceptions.

James B. Hunt Jr. Library
1070 Partners Way
Raleigh, NC 27606
google maps


Directly outside the front doors of the Hunt Library (on Partners Way) is an hourly lot. There is a mechanical arm at the entrance to this lot. You can pay by the hour at $2.00/ hour to park here. Just be prepared, as this lot only accepts credit cards (no cash).

Once parked, you will be entering the Hunt Library on the ground floor. The Duke Energy Room is up the yellow stairs and on your left.

NCSU Wolfline buses also service the Hunt Library on several routes. See the full system map (PDF) or the real-time bus tracking map.