CCEA Past Paper App

Past Paper Wireframes

Project Completed
March 2022

Final design image displaying the past paper site on laptop

Task and Planning

The task was to create a new past paper desktop application for students and teachers and the ability for a teacher to create a mock examination paper themselves. 

The focus of research was to look at the existing CCEA website and use a SCAMPER method to refine the necessary features and take away the content that could clutter and confuse users. Other past paper sites in the UK were looked at to gain ideas on what could be improved and streamlined.  

Ideation and Research

wireframe sketches of the structure and layout

Sketching

The sketching stage was quite simple and allowed me to produce a quick number of rough concepts of how the structure will look. During the research stage it was acknowledged that filters would play a key role in the UX and had to be at the forefront for the user. This led to choosing one concept quite quickly as it was the most obvious choice moving forward. I then created a rough storyboard showing the flow and process a user would take when interacting with the application. 

Refined wireframe sketches

Digital Design

The digital design process was carried out on Figma. This stage was quite simple as a concept was already considered to be replicated digitally. The wireframes showcase the different way the filters can alter the search results. The user has the choice to display these past papers via list or tile. The ‘create a paper’ page is larger in scale and features more filter options for a teacher to find specific questions. They have their own profile section where they can locate their previously made papers or create new ones.  

Multiple screens showing off different actions performed on the past paper site designed in figma
Images of the create a paper screens

Challenges Faced

A challenge I faced during the design process was the ‘create a paper’ screens as I didn’t have sufficient time to complete the digital wireframes for that specific section. However, the final design of the wireframes was consistent with the past paper sections and easy to navigate for users. 

Final Design

Final design image showing 3 different screens of the refined concepts displayed on laptop and desktop
Next Project
Previous Project