Self Evaluation

Design aims- The design aims for this project were to develop a prototype for a social media application to support students studying with the new college. It could either be a native app running on the android OS or as a web app optimized for a smartphone.

Planning targets- First was research, then the mini (success-ometer) project, then the PACT analysis, then a mood board and after this we had to figure out what font and colour scheme to use and which ones would go well with each other. Once we made our choice we had other people evaluate it, then we made a navigation map whilst also detailing what the app would contain, we then designed a lo-fi prototype and had people evaluate it and then it was time to make a Hi-fi prototype and have the evaluated as well.

Testing- For the font & colour design some of my ideas worked a treat with almost everyone liking them and with almost all the highest score but there were other ideas that were not so impressive that most people didn’t take to. For the Lo-fi there was not a score below 4, everyone seemed to like it but there was some constructive criticism. Finally for the Hi-fi prototype nearly everyone knew what to do and if they didn’t they knew how to correct their mistake. So overall almost everyone liked my ideas and they knew how to work my app.

Process- At first I was to do some research on subjects such as Mobile devices, apps, Social media and Hyper local media. This part was very informative and it gave me some good ideas for my project. Next we had to do a mini project on a Success-ometer which was basically to give us an idea on how to go through the design process and this helped a great deal as I instantly knew what to do when it came to designing the app. We then moved on to doing a PACT analysis which was probably one of the most difficult parts of the project because of the various things we had to think about before we made our app. After that we needed a mood board including info and images from other similar apps and then we had to think about actually designing the app. For example what colour schemes would be used, the typography we would use and a mix of the both to see what went well together. We then got people to evaluate our choices to find out what was the most suitable for the app. Once we had a preferred colour and typography we had to make a navigation map and detail the content of the app. This gave me a good understanding of of the layout of my app. With that done we then had to design a low-fi prototype and ask people to evaluate the look to see if it was acceptable. I showed off my designs by uploading my images to a website and using the app of said website on my phone. With the images displayed on my phone it gave everyone a good idea of what the app would look like if the app was on mobile phones. My design was well liked with a few criticisms but there was no rating below 4 (1=poor, 5=Great). With my Lo-fi done I then moved on to my Hi-fi prototype. I made my Hi-fi prototype by using Dreamweaver to link all of my pages together. Once I and done this I got six people to try out my prototype. Almost everyone were able to complete the task that I had given them (get from the log in page to the results page and back again) and even though there were some that made a mistake when trying to complete the task they immediately knew how to resolve the problem and finish the task. Almost everyone felt that it was simple and easy to use apart from one person who felt that it was a bit daunting at first but they did they were comfortable with it in the end. Overall I felt that everyone was comfortable with using the app in the end and they enjoyed their experience.

Problems encountered- I did not encounter many big problems but there was few smaller problems. The first problem I encountered was that some of my colour choices for my Lo-fi prototype were not well received by the people I asked to evaluate my work. In particular my red and white combination didn’t look good to some people and worst of all it made the text difficult to read but in the end it was fine as I had other colour schemes that were better recieved and they even fitted in with the college colours so it fitted together perfectly. Another problem I had was that someone said that my pages did follow the same style so I thought that it would be a problem but the rest of the people I showed the design to were did not see this problem so I never acted on the feedback but I kept it under consideration.

Changes- I only really made one change which was adding another page to my prototypes. This was because I didn’t think that they went deep enough and this would be a problem for when it came to the Hi-fi evaluation as I would need people to follow a path and if it was too short it would not really be testing the path of my app design.

 

The main thing that I have learned from this project is basically following the design process.  I learned to be thorough to make sure that I have a product that the target audience will like and that will fit the brief. I believe that I achieved the aims of this project and I have learned some things along the way like linking pages through Dreamweaver. If I were to do this next time I would expand from the experience from this project and be more adventurous. I would try things like making my app deeper and trying a more sophisticated way to link the pages together like using flash or any kind of code.  Overall I think that my product meets the brief requirements and the design and the functionality of the app are well liked by those who I asked to evaluate my work. So I would say that I am happy with my product.

Hi-Fi prototype evaluation

I got 6 people to look at my Hi-Fi prototype and I gave them the task of getting from the Log in page to the results page and then to go back to the log in page.

Person 1– They took 21 seconds to complete the task, they did not make a mistake, they recalled what they did and they felt it was good and comprehensive.

Person 2– They took 25 seconds to complete the task, they did not make a mistake, they recalled what they did and they felt that it was easy to use and they liked the colours that were used.

Person 3– They took 14 seconds to complete the task, they made one mistake (which was clicking on the logo instead of the log out button near the end) but it did not take them long to figure out what button to press. They also recalled what they did and they felt that it was good, simple and easy to get to grips with.

Person 4– They took 17 seconds to complete the task, they did’t make a mistake, they recalled what they did albeit with some hesitation and they felt that it was ok but it was a bit daunting.

Person 5– They took 17 seconds to complete the task, they didn’t make a mistake but they said that if they did make a mistake then they would know what to do to amend it. They also recalled what they did and they felt that it was easy to use and that it was not stressful.

Person 6– They took 16 seconds to complete the task, they made one mistake (which was going to the news section in the home menu instead of the student section) but once they noticed the mistake they knew how to get back and finish the task. They also could recall what they did albeit with some hesitation and they felt quite neutral about it and that it was not stressful.

 

So what I can take away from this is that almost everyone knew what to do instantly, they were fast at completing the task, they could recall the path they took, most people thought it was not stressful, some thought it was good and some thought that it was simple. There were some mistakes but the people who made the mistakes knew what to do to finish the task and it didn’t take them long to figure it out as well. Overall people were happy with using my prototype.

Lo-Fi prototype evaluation

resultsapp page 1 app page 2 app page 3-01-01 map page staff page-department student page

Screen Layout

Visual Impact- 5/5/5/4/5/5

Clear and makes sense- 5/5/5/5/4/5

Navigation

Clear how to navigate?- 5/5/5/5/4/5

Know where you are in structure?- 5/5/5/5/4/5

Font

Easy to read?- 5/5/5/4/4/4

Size/spacing?- 5/5/5/5/4/5

Appeal to target group?- 5/5/5/5/4/5

Colour

Colours work together?- 5/5/5/4/4/5

Clear and easy to read- 5/5/5/4/4/5

Appeal to target group?- 5/5/5/5/4/5

Additional features

Understand what they do?- 5/5/5/5/4/5

Easy to operate?- 5/5/5/5/4/5

 

ratings are between 1 (poor) and 5 (great)

App Content and navigation

The content that will be on this app will be information on courses as a whole and classes , personal timetables, staff info (e.g contact information), info on students results, student portfolios, a map that shows the locations of the colleges, reminders of important dates (e.g holidays) and any recent pieces of news that is relevant to Fife College.New-Mind-Map_2y1is

Style Evaluation

Opinions 

Person 1-1 Visual: 4       Cultural response: Football   Accessibility: 5      Font: 4      Font & colour: 4

               1-2 Visual:      Cultural response: Football   Accessibility: 3      Font: 4      Font & colour: 3

               1-3 Visual: 4       Cultural response: N/A  Accessibility: 5      Font: 4      Font & colour: 3

               1-4 Visual: 4       Cultural response: Aberdeen   Accessibility: 3      Font: 4      Font & colour: 3

 

Person 2-1 Visual: 4       Cultural response: Desktop/Hospital   Accessibility: 5      Font: 3      Font & colour: 4

               2-2 Visual: 3       Cultural response: Sky/clouds   Accessibility: 4      Font: 2      Font & colour: 2

               2-3 Visual: 4       Cultural response: Office graphic   Accessibility: 4      Font: 4      Font & colour: 5

               2-4  Visual: 1       Cultural response: Blood   Accessibility: 2      Font: 3      Font & colour: 1

 

Person 3-1 Visual: 4       Cultural response: Road sign   Accessibility: 4      Font: 4      Font & colour: 4

               3-2 Visual: 3       Cultural response: Bright   Accessibility: 3     Font: 4      Font & colour: 3

               3-3 Visual: 4       Cultural response: Simple   Accessibility: 4     Font: 4      Font & colour: 3

               3-4 Visual: 4       Cultural response: Blood   Accessibility: 2     Font: 4      Font & colour: 3

 

Person 4-1 Visual: 3       Cultural response: Scottish Flag   Accessibility: 4      Font: 4      Font & colour: 3

               4-2 Visual: 3       Cultural response: Ocean   Accessibility: 4      Font: 4      Font & colour: 4

               4-3 Visual: 5      Cultural response: N/A   Accessibility:4      Font: 5      Font & colour: 5

               4-4  Visual: 1       Cultural response: Rubies  Accessibility: 2    Font: 2     Font & colour: 2

 

Person 5-1 Visual: 5     Cultural response: Sky   Accessibility: 5      Font: 5      Font & colour: 5

               5-2 Visual: 5       Cultural response: Sky   Accessibility: 5      Font: 5      Font & colour: 4

               5-3 Visual: 5      Cultural response: Milk   Accessibility: 5      Font: 5     Font & colour: 5

               5-4  Visual: 3       Cultural response: Blade  Accessibility: 2     Font:    Font & colour: 2

 

Person 6-1 Visual: 5       Cultural response: Sky   Accessibility: 5      Font: 5      Font & colour: 5

               6-2 Visual: 3       Cultural response: Sky  Accessibility: 4     Font: 4      Font & colour: 4

               6-3 Visual: 5      Cultural response: N/A   Accessibility: 4      Font: 4      Font & colour: 4

               6-4  Visual: 3     Cultural response: N/A   Accessibility: 3      Font: 4      Font & colour: 2

 

The results are varied but there are some similarities. One example is that the 4th style is not well liked (which I agree with) and most people thought of blood. Also most people think of the sky when they see the first one or second one and the font is generally liked and most of the time it is accessible.


Typography examples

Typography

I tried out a few different fonts. I started with Baskerville Old face, this was alright but it is used a lot when it comes to books, especially older books. So I could see people losing interest in it as it has been used so many times before. It also did not have any bold or italic styles which may be needed. I then tried trebuchet MS, this is a more modern font. This was a lot better as it was quite simple yet stylish but I think the bold/italic styles don’t show up very well and that could be a problem if they are needed. The other font that I used was Tw Cen MT, this is my most preferred font. Like trebuchet it is simple and stylish which is what I am going for. It is perfectly readable big or small, both numbers & letters look good and the bold/italic styles stand out. The next thing I will do will be putting fonts and colour schemes together to see what goes together.