Developing a drawing application for an Android tablet
For our first ALL (activity led learning) project we were asked to develop a drawing application for our
Android tablets. The application was to be created using the open source software Processing.
Week 1
In our first session, we had to develop a team identity; generate a team name, create a logo, and
record a video to introduce our group.
Our team name was CSI (Computing Student Incorporated).
In our video we decided to showcase images that represented each of us and our hobbies.
Week 2
For week two, we were introduced to creation of apps, by having a go at using App inventor 2.0. After experimenting, we managed to generate a basic drawing app, with features like saving the drawing or setting the background to an image taken with the tablets camera.
Week 3
In our third week we had to list the system requirements and features we wanted for our drawing app, as a group. These included:
- Colour buttons to change the colour of the 'brush'
- Brush Size buttons to change the thickness of the 'brush'
- Save button that allowed the user to save their drawing to their tablet
- Eraser button to rub out parts of the drawing
- Clear button to completely clear the canvas
- Share button to share the drawing on social media
- Gallery button that allowed the user to look through and edit past drawings
- Camera button to take a picture and set it as the canvas
After doing this we created 3 diagrams for our app:
1. System Architecture Diagram, showing the connections for the app
2. Sequence Diagram, showing the interactions between elements of the app and the user
3. UML Activity Diagram, showing connections between features on the app and the actions the user can carry out
Week 4
For week four we began the design process. The week's main task was to plan the GUI for our application. Initially we individually drew what we thought would be a good UI for our app. Then, we compared designs and collaborated on one main design.
The design for our interface was simple, with easy to understand buttons on the main screen (with the canvas). By keeping the interface simple we hoped to not confuse the user, and make it so that people at any age could use it.
Once we had fully drew out our design we user tested our paper prototype on 5 people. We chose to use 5 people as research by Jakob Nielsen discovered that testing more than this number will wield the same results, therefore becoming a waste of time and resources. We tested a mix of students and staff to get a mix of ages in our sample. From this user testing, two things became clear:
- Our app needed a back button that enabled the user to return to the previous screen without making a selection
- On our colour page, we should utilise the entire screen and fill it with a wide selection of colours
- We also needed a help button on each screen to aid the user in using/navigating the system
Using the feedback we received, we altered our design so that it better suited the needs of the user.
Week 5
Week five was the week where we were introduced to Processing, the software we were making our
app on. After working independently to get the hang of processing, we got together and divided the
tasks so that we were all working on a different feature. In this session I was responsible for creating
the clear canvas button.
When each part was completed, we combined each of our code together to create our first completed
prototype. The prototype had the basic features of our drawing app on it (draw line, colour buttons,
line thickness, text, and a clear button).
Week 6
In week six we continued making our app, adding more features to it. In this session, I experimented
with the Control P5 library to make sliders for the colour and size of the 'brush'. However, after
reviewing the idea, we decided that it would be better to use buttons instead of sliders, as it would
be simpler for all users to user. For example, an RGB slider may be confusing for a child to use. With
a button, no explanation is needed; a button affords pushing.
Week 7
For the first session of the week we made the final changes to our app, for example, altering the parameters so that they fit the android tablet. We then created a presentation that contained:
-Our initial design
-The planning stages
-User testing/paper prototype
-System requirements
-Our final app
-Reflection
Our final app had the majority of the features we
had planned to include. However we found that
some of the features were very difficult to actually
implement, so some were left out. However, we feel
that with the features that were included in the app,
we managed to meet our aim of making a drawing
app that can be used by any age.
Overall, I feel that we worked well as a group; we
regularly communicated with each other both inside
and outside of the lab sessions. We listened to each others ideas and helped one another when we required assistance. Throughout the entire project we split the weeks tasks evenly between us, ensuring that the workload was equal for each member and that each person got to participate on the final product.
