Hybrid Web Application – MyQuest
Module: Hybrid App Development (Module Grade: 96%)
An interactive hybrid web application created with an aim to assist new students by providing information and advice to help guide them around the University Campus. The application was developed as a single page application using Adobe Phonegap (Cordova), it includes OpenStreetMap integration and used Google Firebase for user and data storage.
Web Application - ASP.NET MVC & API
Module: Cloud and Web Services (Module Grade: 96%)
A second-year project learning how to develop a ASP.NET MVC Web and API Applications with Entity Framework, requiring the creation of a multi-tiered web application including unit of work, repositories and dependency injection, plus connected services such Windows Communication Foundation (WCF) and application programming interface (API) consumers.
Along side the prototype web application, documentation detailing how this might be deployed on the Microsoft Azure Cloud Computing Platform was written up. Please feel free to review the Microsoft Azure document and screen captures of the application, using the links below.
Web Application - Content Management System
Module: Server-Side Development (Module Grade: 95%)
This second-year module required the development of a web application in the form of a content management built using the Yii2 PHP and MySQL based framework. This application has specific aims to support the next iteration of LibQuest, an interactive augmented reality application, which helps introduce and guide students around the University’s Library.
Before development could begin I was required to create a technical specifications document using eWurf or similar and database model using Vertabello, as well keep a diary throughout the project. Please feel free to review the working prototype, development diary and supporting documentation, using the links below.
Web Application - Scripting Portfolio
Module: Front End Development (Module Grade: 84%)
You can view this portfolio of work via the link below.
Prototype Web Application – Web Accessibility
Module: Web and Mobile Development (Module Grade: 88%)
With this first-year project I learned how structure HTML5 and CSS3 in a mobile-first responsive design and incorporate WAI-ARIA roles to aid screen-reader software for users with visual disabilities. The task was to create a fictitious company and develop a working prototype web application, based on HTML5, CSS3 and jQuery with web compliancy and social media elements.
Technical documents, wireframes and mock-ups were produced during the planning and development process. Feedback was sought from both peers and tutors to review and reflect on during key stages of the project. Please feel free to view the website, eWurf technical document and mock ups I created for this assignment, using the links below.
Web Application – NHS Break Glass
Module: Technical Enterprise Solutions (Module Grade: 85%)
A web application prototype with companion app, created for the North Tees and Hartlepool NHS Foundation Trust. The application provides an updated system for their in-house Break Glass protocol, which allows for safe-staffing on hospital wards.
My role in this project was as the server-side and web application developer, I was responsible for creating application wireframes, prototypes and working prototype. User and shift management systems were created for the web application, providing the ability for staff to create and process requests for shift cover. A RESTful API was created to allow the companion app to communicate with the server and work along-side the web application.
Laravel 5.7 along with authentication, API, notifications, broadcasting, queueing and task scheduling were used to create the server-side platform and web application. Laravel Echo and Pusher were used to provide real time notifications and MaterializeCSS was used for layout and user experience improvements.
Adam Ruddock from the NHS Foundation recognised our work on this project as “one of the best they’ve seen, even compared to companies showing their work”. For more information on this project, please follow the link below to a news article on the Teesside University website.
Web Application – EPOQ / Upload Unplug
Module: Web Group Project - Brief 2 (Module Grade: 77.30%)
A prototype web application was created for the client as a follow up project as part of the same second-year group module. A performing arts troupe required an application that would work in tandem with their live show. Guests could be invited to provide feedback before and during the show and their responses would provide real-time data to staff, this would allow them to adjust the performance based on that feedback.
My role in this project was that of the designer and front-end developer, I worked along with the back-end developer using Angular and Google. Application wireframes, user requirements documents, product artwork as well as scripting and stylesheets were created for this project.
Web Application – LeasePad
Module: Web Group Project - Brief 1 (Module Grade: 77.30%)
A prototype web application created as a “bid for the contract” as part of the scenario designed for a second-year group module. We were not given a topic for the application, so came up with the idea of a communications platform for landlords and tenants.
My role in this project was that of the designer and front-end developer, I worked along with the back-end developer using Angular and Google Firebase. Logo design, application wireframes, user requirements documents and product artwork plus scripting and stylesheets were created for this project.
Web Application – Computing History Timeline
Module: Web Industry Skills (Module Grade: 87%)
As part of a first-year module, the first assignment was completed in groups with a focus on learning how to research, reference and work as a team. We were tasked with the creation of a HTML5 and CSS3 based web application, this would present our research findings looking at key dates and events which lead to the advancement of computers. In addition, we researched one future technology – Augmented Reality.
We presented our work to peers, tutors, other students and staff where we displayed our website, posters we had created and provided a demonstration Augmented Reality which showed an animated version of our group logo which popped out from a piece of paper shown using a mobile device and a specific application. Please feel free to view the website and posters that were created for the group project, using the links below.
Application Prototypes - User Experience Design
Module: Multiplatform UX Design (Module Grade: 90%)
During this first-year module, I created application prototypes for smart watch, mobile and desktop devices. The project required the development of interactive prototypes for an identification app, including the research and planning stages, with the use of mood boards, basic and detailed wireframes, plus supporting documentation.
The application prototypes were created using the InVision web application and I was asked to create a video about the journey throughout development process. Please feel free to view the three prototypes I created for this assignment, using the links below.
Technologies used: Adobe Photoshop, Adobe Illustrator, Adobe Acrobat Pro, Microsoft Word and InVision App.
Every project starts with research, whether this be primary or secondary methods, getting the facts right enables us to make informed decisions. With primary research in the form of surveys, questionnaires and feedback forms, as well as secondary research by reviewing journal and news articles, product, technology and competitor research, as well as reading news articles and consumer reports.
Included below is a video produced as part of an assignment for the Multiplatform UX Design module and the documentation to accompany it, these demonstrate primary and secondary researched examples. Also offered is a document which provides an example of quantitative and qualitative analysis, based on primary research completed during the planning of this portfolio.
Technologies used: Adobe Audition, Adobe Premiere Pro, Adobe Photoshop, Adobe Acrobat Pro and Microsoft Word.
Audio & Video
Podcast and Film Clip
Module: Music, Sound and Video (Module Grade: 85%)
During this first-year module, I learned about the history, technologies and methods for creating audio and video artefacts. I was first tasked with creating a podcast based on an iconic artist from the 1980s, who’s actions had created a defining moment for the music industry. I created the script, voice recording and included snippets from the artist’s music, you can listen to this clip below.
The second assignment required a film clip or “mini-movie” based on Day of Triffids to be created, I was asked to remove all of the sound and replace this with my own, add a countdown timer and add titles and credits for a mock movie studio. Please feel free to watch the mini-movie that I created for this assignment below.
Technologies used: Adobe Premiere Pro, Adobe Audition and Adobe Photoshop.
Adobe Air Application – Flash Game
Module: Interactive Animation (Module Grade: 94%)
During this first-year assignment I was given the task to create a game using Adobe Flash and ActionScript to be published as an Adobe Air application. Requirements specified that planning documents, mood-boards, wireframes and storyboards should be created before developing the game itself. You can watch a playthrough of the final game in the video below.
The full documentation is viewable in the Report Writing section, however please feel free to view the individual parts included, via the links below.
Technologies used: Adobe Photoshop, Adobe Illustrator, Adobe Flash, ActionScript 3.0, Adobe Acrobat Pro and Wacom CINTIQ Companion 2.
Whilst working and during my time at University, there have been various opportunities to improve my presentational skills. As part of a first-year module I was asked to do a formal presentation for tutors and peers, with a focus on upcoming trends and technologies in web development.
The video below demonstrates my use of slideshows during presentations, the topic for this piece was Single Page Applications.
Please feel free to view feedback review document, using the link below.
Technologies used: Microsoft Word, Microsoft PowerPoint and Adobe Photoshop.
Throughout my first and second year of studies, I have learned to write concise documents, following specific standards and guidelines, outlined by the University. One of the early tasks I received was to create a report template and this has been used repeatedly for different assignments.
A first-year assignment required the create of a full report based around research, planning and development of an Adobe Air Application. Please feel free to read the included report, which was written for the assignment, using the link below.
Technologies used: Adobe Acrobat Pro and Microsoft Word.
During my studies one of the fundamental skills I have had to learn is how to correctly reference my sources of information and media content. At University of Teesside, within the School of Computing, Media and the Arts (my school) the Harvard referencing style is used.
Initially I found this to be rather difficult, though with practice and the assistance of the referencing guide, I have been able to master this. The guide I refer to is Cite Them Right (Pears and Shields, 2016). There is also an online resource, Cite Them Right Online (Macmillan Publishers Limited, 2016), which provides easier access to the same information.
There are also various tools available to help make referencing easier, such as RefWorks (ProQuest LLC., 2016) or CiteThisForMe (Chegg Inc., 2016). You can see full examples of how I use referencing within many of the works included on my portfolio.
Chegg Inc. (2016) CiteThisForMe, the no. 1 citation tool. Available at: http://www.citethisforme.com/ (Accessed: 8 August 2016).
Google Inc. (2016) Chrome. Available at: https://www.google.com/chrome/ (Accessed: 8 August 2016).
Microsoft (2016) Microsoft Office. Available at: https://products.office.com/en-gb/home (Accessed: 8 August 2016).
ProQuest LLC. (2016) RefWorks. Available at: https://www.refworks.com/refworks2 (Accessed: 8 August 2016).
Technologies used: RefWorks, CiteThisForMe, Microsoft Word.