The C.C.C (Chinese Community Centre) is in search to improve its current online platform to be able to send the right message out to the general public that able them to have a better understanding of C.C.C’s ethos and the kind of support they can provide.
C.C.C has been around the Chinese community within London for the past 40 years, however, their online presence is lacking and dated. With the industry moving heavily towards the digital world. C.C.C would like to establish a digital platform that showcases the services that they can offer. However, with an overwhelmed of information current set within their website, it is causing confusion to their audiences.
At first glance of the existing webpage of C.C.C, it is lacking organisation of content hierarchy. This makes it troublesome for users when visiting the website to navigate around.
Before taking further actions, a few goals were created at the beginning of the initial stage of the design process. This allows us to ensure our design aligns with our goals through the design process and ensuring our assumptions are validated.
To gain a further understanding from the client perspective of what are the key goals of the users when visiting the community centre
Investigate the current structure of how C.C.C is built in terms of their internal and external communication processes. I.e memberships sign-up, events sign-up, etc.
To understand what brand message that C.C.C wants to project out to the public and audiences.
To seek and understand what are the reasons and goals of C.C.C wants to achieve through their website.
The following above is the type of research method and process that were used to gather data to validate our assumptions..
Before taking further research, we analyzed the existing website of C.C.C. to gain insights on how their current system and processes that are taken
Currently, all the sign-up or contact systems are done through a manual download system where the user downloads a PDF form to conduct any sign-up process.
The existing website of C.C.C is lacking a content hierarchy structure, which makes it difficult to navigate around the website.
The community centre is experiencing younger demographics visits that want to be part of the community. Therefore, we need to establish a better system that would appeal more to this demographic for it to expand further.
The main demographic within the C.C.C is still the elderly, therefore the functionality and the intuitive aspect of the website has to perform particularly well for them.
The home page of the C.C.C website currently has an overwhelmed of tabs and buttons, which confuses the users when they visit the site with a purpose.
An overwhelm of information when visiting, makes it hard for the user to digest the information to fully understand what C.C.C can offer.
A new site map is formed based on the findings from the site analysis and communicating with the marketing and communication team within C.C.C. This now acts as the skeleton of the design of the new website. With this construction, we can gain an understanding of the flow within each screen whether it would cause any pain points or if it is going to work effectively well.
We began putting ideas of features that can be added to the new website that could potentially help with the system processes for both the C.C.C team and the users. However, after gaining direct feedback from the C.C.C's team, they feel that they currently do not have the resources right now to digitise all the processes to be online. Due to it would cause more harm than good to their internal system structure.
Therefore, we have worked out a feature road map to launch different features at a different timeline to suit. This would give time for both internal and externals users to prepare and adjust to this new space.
A V1 Lofi-Wireframe was created after de-constructing the existing C.C.C website. To establish what are the required ‘need’ content and the ‘want’ content. This is to gain valuable feedback from the client to understand whether this design aligns with their thoughts before further design development.
V1 Testing has the aim of testing and evaluating the following;
A V2 Lofi-Wirefrma was created based on the feedback from the client with design input and consideration of the font's size, typeface, colours, etc. This ensures that functionality within the website corresponds well against the client's needs before taking any further design development.
V2 testing has the aim of testing and evaluating the following;
Once the content hierarchy and the flow within the website are established. We want to establish the right vibe and message that C.C.C would like to project to the public.
At first, C.C.C's team wanted to show the harsh reality of what is happening right within the Chinese Community that needs help. To trigger the psychology within the people to wants to help the people who are in need.
However, after discussion, we feel that this may drive people away. Therefore, we established that to project a positive vibe and atmosphere to the general public. Demonstrating what we can achieve together as a community. To bring people together within.
Transparency is honesty. We use facts and figures within the design to create an honest and trusted brand image towards the public.
A clear fact of the number of people that are already part of the community. To project a message that we are a huge community and you would not be alone if you were to take part.
A clear fact and figures of each month's achievement which projected to the public to build a stronger awareness. And show to the individuals who have donated to the community centre that, where every little helps and it will make a difference.
A clear of facts to show where every donation goes towards and how it is used. It not only shows a small amount can make a difference to those in need but it also creates transparency of how the donation is used.
We have prioritise and focus on the values of the community centre. This is because the values of C.C.C is what makes it unique compared to its competitors and it also builds stronger confidence towards its target audiences.
We noticed the internal booking system within C.C.C was still conducted manually through the phone call or a visit to the centre. However, through observation, the centre is experiencing more traffic of inquiries through the website. Therefore, we implemented a simple booking system within the website to ease off the workload from the C.C.C team.
Using nature aspect like the mountains, river, clouds and the sun as part of the visual representative to produce a calming and approachable atmosphere to the public.
With illustration of people added into the overall visual design to project a people based community centre, building relationship within.
A visual appearance visual engagement between 2 person communicating. And one people with a phone in his hand to demonstrate how it is used. This is to build an image of value of they are here to provide help.
Injecting visuals like the bamboo and the lantern to build a Chinese heritage flair into the overall visual, demonstrating it is a Chinese based community. And that's the main demographics they focuses on.
A visual appearance of the community centre of build they have a solid physical space. Projecting a welcoming atmosphere to the public.
An illustration of a person doing arts and crafts. To demonstrate the kind of activities that the community centre offer to the public.
The topic of either using photos or illustrations sparked up due to this can dictate the overall aesthetics of the website. We decided to use illustration, due to the limited resource of funding within C.C.C. This is because having access to quality photos required licensing which could increase the overall funding. Therefore, illustration can be a cost-effective solution and yet produces a consistent aesthetic throughout the website.
The services description is designed to be short and sweet, also supported with an illustration on the side to make it easier for the users to understand.
A scrolling system to view all the classes that are on offer with their information. Including a simple sign-up system that produces an automated message to both C.C.C and the user when a sign-up action has taken place.
The colours and font chosen below are based on the brand image that C.C.C wants to project to the public. A matured, professional and approachable organisation.