App Jam

This weeks activity is to create an app using the following VNA(Verb, Noun, Adjective) cards as a theme. The app should be made in the style or process of an App Jam, where rapid and intensive development should be key within a strict time limit.


On reflection of my work in week one, presenting a creative piece, I learnt that too much choice hampered my ability to act in a specific direction and produce any surmountable piece of work, as such I implemented some restrictions on myself to narrow the scope and help me pick an idea quickly whilst also keeping true to the theme. After all the objective is to create something and reflect on the process, rather than whether or not the applications concept is good.


Web App.

My interests for future employment and personal study are within the area of web application and server side implementations. Previously in week two I had spent considerable time comparing and learning web technologies. Creating a web app would allow me to put into practise what I had learnt, whilst also offering a good educational challenge.


With work and life obligations the allocated amount of time I would be able to spend on the App Jam, not including any reading from the course module reading list, would be 24 working hours. During this time I will need to:

  • Create a concept.
  • Determine the technologies needed.
  • Allocate the time.
  • Design the user interface.
  • Develop the app.

Working Prototype

By the end of the 24 hours I want to have a working prototype, not too far off a minimum viable product, The application may not look incredible, but could present the concept and idea of the application clearly. As such the prototype should be the bare bones of the concept and features should be kept to a minimum as to fit within the time restraints and my current knowledge.

App Jam

Time Management

  • Concept (1hr)
  • Design (1hr)
  • Research (4hr)
  • Development (18hr)

Research will be interwoven with development as a when required.

  • Sunday 17th February (Day) - 12hrs
  • Monday 18th February (Evening)- 4hrs
  • Friday 22nd February (Evening)- 4hrs
  • Saturday 23rd February (Morning) - 4hrs


Guide, Opponent & Restricted.


I aim to build an education portal for an application, an online portal that will guide the user through a piece of software, so that they feel less restricted and less like the app is the opponent. Education material with will be in the form of a video and can be categorised per subject or feature. The web application will be available via any modern web browser and formatted correctly to the viewing device.

User Stories

  • As a user, I want to be able to select a subject or “course”, so that I can see available material categorised logically.
  • As a user, I want to be able to select the material or “lesson”, so that i can learn the material.
  • As a user, I want to be able to mark a lesson as complete, so that I can see my progression within the course.


  • A user needs to be able to register a profile and login to the registered profile.
  • A user needs to view a selection of courses (categorised lessons) from a single page within their web browser when they are logged in.
  • A user needs to be directed to a single page presenting a collection of lessons after selecting a course.
  • A user needs to be directed to a single page presenting the material after selecting a lesson.
  • Lesson material will be in the form of a .mp4 video.
  • A lesson should be marked as complete when the material has ended. This action should be attached to the profile of the user, so that progression of a course is persistently saved.

Database Architecture

  • A User has a Profile. (One to One Relationship)
  • A Course has many Lessons. (One to Many Relationship)
  • A Profile can “complete” many Lessons, whilst also, a Lesson can be completed by many Profiles. (Many to Many Relationship)


Here follows a selection of Sketch drawings that show what the final pages of the web application could look like. Using Stamp as an example piece of software this web application could be based around to educate its users, I have given the name of the application, “Timeline”. The idea is that a users education is reflected on their own personal timeline. As a prototype, I don’t expect for the application to look exactly like this but development will be driven by these design choices, paying attention to the required fields or information on each page:


  • Name
  • Email
  • Password
  • Confirm Password


  • Email
  • Password


  • List of courses
  • Course Title
  • Course Description

Course Lessons

  • Course title
  • Course Description
  • List of Course Lessons
  • Lesson Title
  • Lesson Description


  • Lesson Video (.mp4)
  • Lesson Title
  • Lesson Description


The application will be developed using the Laravel Framework to take advantage of the learning I have done previously in week two and to further educate and better my understanding of the framework. To limit needless time researching and implementing a database system and web hosting, all development and hosting will be done locally, on my mac. the video file MPEG4 (.mp4) will be used for lesson material as research informs that it is the most commonly used and supported compression file format across the range of web browsers.

Summary (Reflection)

Outcome Video