Author: PeterRosanwo

Cowrie Scholarship Foundation

Background

The Cowrie Scholarship Foundation was set up to allow economically disadvantaged black students to attend UK universities and with the foundation being very new our client needed a brand that looked youthful and energetic but professional and as a continuation from the branding project the website for the foundation needed to be upgraded to match the brand. The website needed to appeal to students and stakeholders alike therefore we needed to create a striking balance between the two to attract scholars and investors which is our client’s main goal.

Brief

The brief was to develop a website on an easily workable and adaptable platform. The client would be adding more universities and business they would need a website that they can easily add on to whilst still maintaining a good user experience. The secondary deliverable was to design social media posts for his Instagram and LinkedIn. The brief stated that the success of this project would be measured by the ease of use by the client to add on to and edit. This was essential to make sure there was consistency within the quality of the design and making a website that the client can use and work with without affecting the design quality. So far since the launch of the website the client has had no problems with adding unto and editing the website.

Communication

Throughout the design process, we had regular meetings with our client. This allowed us to keep our client up to date making progress by having weekly feedback session to creating a website the client was happy with. On the other hand, our contact with our supervisor was not as frequent as we would have wanted it to be although, in the sessions, we had our supervisor was happy with the progress we were making.

Schedule

The deadline for the website completion was met following the guide of the restated brief. During the second week, there were fears that the website would not be completed on time before the submission deadline due to complications of which programme we would be using to develop the website. During the real jobs meeting, we spoke to Geoff about the possible programmes we could use to develop the website and our choices were narrowed down to Squarespace and WordPress and we, therefore, needed to propose both options to our client. This process delayed the schedule by a week however once the client responded with Squarespace, we were then able to begin the design process and get back on track. After this, we had weekly feedback where we were able to progress weekly to provide the website that the client would be happy with which enabled us to hand over the website on the deadline.

Design process

The problem

  • 5% of British students from black Caribbean families gained places in “high tariff” universities, compared with more than 10% of all students. While many issues are at play in why more Black British students do not enter university – the Cowrie Scholarship Foundation seeks to address one part of the jigsaw – the financial cost of university education.
  • Richard set up the Cowrie Foundation because of the murder of George Floyd in May 2020. Richard was inspired to create this foundation after being influenced to create change following the death of George Floyd. Cowrie is a very fresh organisation therefore there is an opportunity to bring something exciting and distinguishable as a brand. Cowrie Scholarship Foundation was set up to allow economically disadvantaged black students to get a university education at a Russell Group university.

The users

We identified three user groups: The student, the parent, and the shareholder. Each user group would have specific goals within the website. The student’s main aim is to apply to the scholarship through the website. The website needed to make this process as easy to understand as possible as one of the client’s aims is to get scholars into the scholarship. Secondly, the parent main aim is to provide opportunities for their children therefore the parent would be looking to the foundation values but also on past scholars to see if the foundation would be the right fit for their child. Lastly, the shareholder’s main purpose on the website would be to donate to the foundation however the process before that would be important. The shareholders would need to understand what the foundation is and how their money could help change lives.

Fig1 The site map showing how the target audience would navigate throughout the website.

 

Wireframes

Initial sketches

Fig 2 Initial sketches for the website testing user experience and format.

 

Fig 2 Initial sketches for the website testing user experience and format.

Developing the website based on the specific needs of the user was important and the layout for each specific sector was the most important. The hardest part was making the website more concise with a lot of relative information it would be easier to have multiple pages however, this makes the website look unappealing therefore we decided having drop-down menus would make the website look less cramped together and more spacious. We decided on having a scholarship programme, about us, contact us and news.

Lo-fi wireframes

Fig 3 usability testing and the results
Fig 3 usability testing and the results

Now that we had a plan with the initial sketches, we decided to create lo-fi wireframes via XD to test the user experience of our proposed design layout. Following the user testing we able to identify what needs improvement and what was good to create a workable website that the users can use easily. With this information, we decided to start designing the high-fidelity website on Squarespace. The process of testing the prototype was a little bit tedious because we struggled to find a user that was similar to the target audience, but we eventually found someone.

The brand

During the branding project, we produced new logos for the client however the client decided to keep their current logos that we had to use.

The typeface that the client wanted us to use was Arial for the website. We selected a few weigh and size variants to differentiate headings, body and captions. Arial is a very legible sans-serif typeface and allows the users to easily gain and digest the information provided by the website.

The client requested us to make heavy use of the black and yellow colour scheme used for the initial website. After we utilised some of our colour schemes to help differentiate web-page’ sections or to help the overall design being more engaging. As previously mentioned black and yellow were the defining colour of the branding. Other colours such “Blue Magenta” or “Harvest Gold” were used respectively for clickable links or illustrations and elements throughout the website. Squarespace offers the possibility to choose a colour palette as one of its tools made of 5 colours and allowed us to create different colour themes to chose depending on what page or section we were working on.

The process of image selection started with us using license-free pictures mainly depicting black students revising, working or at university. All the images were then shown to the client for feedback and approval. This happened a few times as the images had to be appropriate for the website, not too corporate but the pictures also had to be relevant in the context of education, achieving and hardworking which are some of the core values of the foundation. The illustrations present on the website are the tiles and one illustration designed from the previous version of the website we developed for TY3BP that the client liked and wanted us to keep it. The tiles were made on Illustrator and they are part of a larger group of traditional Ghanian symbols called Adinkra symbols that represent concepts and aphorisms. The tiles are used to divide the first elements of each page from the rest of the content underneath.

Final design

The design of the final website was clear and accessible for the client and the user. The overall design was successful as the client was happy with it. We had an initial plan an idea that we felt could have enhanced the outcome however we were limited by the software and our ability to recreate the XD prototype. The design decisions were moderately made by us however the client had the final say in the majority of the final design decisions. This led to elements of the website that we did not particular felt met the quality that we felt was needed however we found ourselves having to put the client’s needs first which we felt we could have been more critical and outspoken for our own design decisions however, overall, we were mostly happy with the outcome.

Feedback

The feedback we received was mostly positive with the client writing; “It has been a pleasure to work with you both. The level of work, attention to detail and willingness to incorporate requested changes was greatly appreciated.” We have not yet received official feedback from our supervisor yet although from the last feedback session she advised us to take more control of the project as the designers which I believe we did towards the final week of the project.

Conclusion

The feedback shows that the website is effective and easy to use. This implies that we have been able to achieve the aims listed in our brief and seeing the website go live was a proud moment for both of us. We believe our client is happy with the outcome and we have seen that he has comfortably been able to make changes to the website which was his main aim for the brief. Overall creating the website has taught us important skills within UX design and development that we can both use in the future.

The website link: https://www.cowriescholarshipfoundation.org/

– Peter Rosanwo,  Edoardo Sarli

Typography External Wall Graphic

Background

The Department of Typography and Graphic Communication at the University of Reading building wayfinding needs some refinement. The department needs a distinctive sign to indicate the building upon arrival. The design of an external wall graphic needs to be impactful because the sign would need to be noticed from afar from the enterprise car park for students, delivery and prospect students coming for application day, open days etc.

Brief

The brief was to design an external wall graphic for the department that can easily be recognised and needs to represent the department and the students and tutors alike. The final deliverable would be a press-ready pdf and the ai file ready for production by the department.

In the brief we stated, the success of this project would come from the users being able to recognise the building. The building would be eye-catching in an effective and positive way. The success of the project also depends on if the graphic elements represent the building and the department. Throughout the project, we ensured that the graphic elements were a representation of the department and are relatable with the tutors and the students. We wanted to make the department as user-centric as possible this was demonstrated through the surveys taken and the frequent feedback between students to get their perspective on what the department means to them. Although the real job has yet to be finalised as we wait on the specifications of the new windows our client and our supervisors alike have stated that the current design proposals are very encouraging.

Communication

Throughout the project, we had regular meetings with our clients and supervisors as well as attending frequent real jobs meetings. We felt it was important to get a different perspective to make sure we were in the right direction through the project especially after both of us have never designed wall graphics before. We also communicated with our peers to get their perspective on what they would like to see in the wall graphic. We conducted a survey to get the perspective of both the tutors and students and collated this to get an idea of what we could do moving forward.

Schedule

The schedule for this project has been disrupted heavily due to the COVID-19 pandemic. The original deadline was 20/04/2020. This has led to the project having to be stalled for a couple of months. The project is still currently progressing as we wait for the specification of the new department windows. At first, the project was progressing gradually without interruption and after the covid restrictions, we were limited to what we could do. We were able to successfully carry out the survey where we were able to make progress with making design decisions. Once we had an idea of the colour scheme and themes via the mood boards and survey, we were able to start proposing designs to our supervisors and our client. The process was mostly moving swiftly barring lockdowns in between. The designs were refined and edited during the months of feedback from our supervisors and clients.

Design Process

We attempted to start our design process with a general mood board (see Trello) showcasing different variations of wall graphics, both indoor and out. This collection of images is so we can gain inspiration from and look to gain any insights that may not have been so apparent beforehand. These general ideas would stand as a basis that may allow us to incorporate further ideas to at a later point in idea generation. During this time, however, we realised that the job at hand is very much to do with the community within the department than just the department itself. We realised that we wanted the people who reside within the building to be reflected in the graphic also; a more personal approach to the department would make more sense for this specific real job. The best way we thought we would do this is by creating a survey for all members of the department, staff and students, to take part in. The questions would be set up to try and gauge what the community thought that the building represented and what they wanted it to represent. These answers would go on to inform much of the decisions going forward and acts as a basis for us to refer back to in order to progress. Answers to do with the actual visual identity of the department are the best for these types of decisions; an example would be the colours that people came up with when they thought of the department.

An example of the survey result

From here we started on initial ideas for the graphic, and now we had a stronger basis for idea generation from the survey. Immediately we started to incorporate these findings within our work; some of which displayed the most popular answer for the colour that attributes to the department. Some of the initial designs also attempted to go the route of modern via the feedback that the departments do not represent modernity in design as much as they should, and some took the opposite route of embracing the traditional and historic look and feel of the department. We also took to approaching the graphic in multiple ways, some being with the use of type, some with the use of photography, and some with illustrations. We wanted to try out multiple solutions, and the brief in general is one that would allow us to do so. Throughout the entire project we had also been trying out different approaches to where exactly on the wall we would be designing the graphic for; the brief was left open for us to choose ourselves what the best option may be, and our client also shared this sentiment when asking him. He would often tell us that he wanted us to have more control over design decisions and that making decisions on things like where the graphic should be would detract from finding possible design solutions, and could essentially stunt creativity. This did allow for us to flex our creativity where we wished, but it did make it difficult when making decisions, and at times felt like too much freedom was given to us. The further we moved through the process the more we started to hone in on more solid concepts and ideas that would genuinely reflect the department and those insides.

Our next set of ideas incorporated the inside of the building. The interior of the department is very distinctive and has many pieces of ephemera and many old display pieces on the walls and in the hallways; we decided to take these as inspiration. Not only do they represent the inside of the building and its unique visual interior, but they also embody a large part of what is recognised from the department; its historic collections and general historic reputation. Moving from here, however, we would attempt to work in more modern elements to balance out the more traditional part of the concept; it would also allow meaning that we hit another criteria that were mentioned in the survey. This part would be to do with what was missing from how the department was being represented. This is the point where we decided to integrate the more modern use of iconographic illustrations. The icons did well to balance the traditional with the modern, especially when we started to illustrate the historical ephemera also.

At this point we had also decided on the use of multiple colours pointed out from the survey. We were also in conversations with Geoff to do with the application of the actual graphic, giving us the choice of multiple types of wall mounted panels.

At this point we had also decided on the use of multiple colours pointed out from the survey. We were also in conversations with Geoff to do with the application of the actual graphic, giving us the choice of multiple types of wall-mounted panels.

Around this time, we were given feedback from our client regarding a suggestion of placing the graphic onto the windows, and after further conversations with Geoff, we were given the green light for a whole new avenue of designs. Our proposals now included ideas that would be placed onto the windows using a one-way see-through material called Contravision.

Unfortunately, as a new door opened, new problems arose. The department is due to get new windows installed and even up until submission it has remained unclear exactly what the dimensions of the windows are to be. Instead of waiting, however, we made the decision to move forward instead of lingering for an unknown amount of time. As a result of not knowing what the specific dimensions were, we took the initiative to base our designs on the most recently installed double glazed windows in the department at the time.

At the point of submission, we have not been able to finalise our designs and achieve a press ready outcome. Due to the nature of our job it was been agreed on that we will submit what we have at the moment, and make it as close to a convincing set of proposals as we can. It is to be noted that we will also be carrying on the real job after submission, and so the concepts we are submitting are currently still in development. Both our client and us as a group, believe that the concept is such that is flexible in application and is able to be adapted effectively to a new set of window dimensions if need be; until we get the correct dimensions from the project manager, we will be continuing with the sizes we have at the moment.

Feedback

We are still yet unable to get feedback for the final product however based on the progress we have made so far it has been mostly positive from the client and the supervisor. Overall our client has been happy with the progress we have been making and has often remarked our concepts as quite strong outcomes with a good amount of potential when finally implemented. A word from our client to justify this; “you have so far made very good progress on the real job, and have found a viable, realistic and attractive design direction, which shows considerable promise. I look forward to you continuing with the project so you can bring it to a successful conclusion in the coming weeks, following your submission of work completed to date.” Our supervisor is also encouraged with our current proposition and once we have the correct window settings we believe we can create a design that represents the department in a distinctive and eye-catching way.

Thank you from the team working on RJ00412