Design a site like this with
Get started

Portfolio & Website – Speculative Email

As part of portfolio & website project we were asked to produce a speculative email that we would send to a potential employer asking for work experience or even a job. I completed the work placement project in January as part of my Field Module Explore. AS part of this we had to contact and arrange placements on our own which meant that I have some experience in writing emails to studios. I decided to use the email I had written for this as a template. Below is the speculative email:

Hello Leanne,

I’m Abbie Williams a second-year student studying Graphic Communications at Cardiff Metropolitan University, Cardiff School of Art & Design.

I have followed Girl & Boy on social media for a while and I love the work that you create. One project in particular that I really admire was the new brand identity you created for Seriously Stylish Business. I loved the colour combinations that you used and the elegance of the brand. I also admire the wayfinding and branding you’ve done for Bayscape, having walked past these many times I noticed the signs easily and thought that it was executed amazingly.

 As I am currently coming to the end of my second year the primary reason for my email is to see whether you’d be able to offer me a work placement opportunity at all. I have a great love for typography, editorial design and photography but I’m keen to learn more about branding, web design, motion graphics and just more about visual communications. I think that I could learn a lot for yourselves at Girl & Boy but also be a good asset to your team as I’m hard working, focused and could help develop some new ideas.

I have attached a copy of my CV and my portfolio that shows off some of the work that I have been working on recently. If you had any time it would be great to meet yourself, even if it’s just to get some advice/feedback on my work.

 I hope to hear from you soon,

 Best Regards


When I spoke to Jay about how we were handing in the email, we spoke about the design elements of it. Jay suggested creating an email signature to show further how the branding would work with admin elements of being a designer. I looked at a few of the email signatures that I had received in the past as well as a few online noticing that they included email address, contact number and often links to social media.

Screenshot 2020-06-03 at 14.03.52Screenshot 2020-06-03 at 14.04.39Screenshot 2020-06-03 at 14.05.06

With this in mind I used a 650 x 150 pixels board to create the signature. I used a very simple layout that resembles the design of my portfolio, cv and website. I have used the same social media icons that are at the end of my portfolio within the signature, therefore creating that link using the coral colour which has been a focus throughout the course of this project. To show how the signature would work, I have mock-up up the email with the signature. I feel that it works well and shows how it might be used across admin elements of my work later on.


Portfolio & Website – Website Design Progress

Website –

Following my feedback on my website, I needed to refine the content of the work but also refine the design elements of it too. Firstly, I decided to refine the content of my website. I have included the three projects from 2nd year as well as adding in one of my field projects. Over time I think that I will grow the number of projects being shown on my website however, for this moment in time I felt that it was best to have the 4 projects.

To reflect and link my portfolio and CV to my website, I made the subheading on the website the same coral colour that I have used throughout my branding. I haven’t included as much type on the website as I wanted to work to speak for itself. I also haven’t overloaded the projects with images just selected a few images but there are more images on the website than my portfolio. Depending on the project I have made sure that all the video content is working and placing within a mock-up to give the viewer a sense of how it would work in real life.

Screenshot 2020-06-03 at 14.31.15

Even though I have included an about section for the website I felt that it needed some imagery of me, to try and make it more personal. I also felt that an image of me would make a nice addition to the landing page of the website. I am fortunate enough to own my own camera and tripod which meant that I was able to set up a mini shoot to get the images that I needed. I used the rule of thirds for the set-up of the photos as I felt that it would allow the type that would be placed on the landing page to work better with the image. I think that by adding these images give the audience a face to put to the name rather than just imagining me. On the landing page I have added a scroll down button, a short description and a welcome phrase. I ensured that the image work when both viewing on the laptop and phone.

Screenshot 2020-06-03 at 14.31.47

Screenshot 2020-06-03 at 14.31.38

In the tutorial we talked about adding a custom domain name to my website. I thought that this was a good idea as it would add a sense of professionalism to my work. I was able to purchase my domain name and add it to my website easily through Adobe Portfolio. I have found using Adobe Portfolio easy and familiar, it’s also quick and simple to make amendments to the website.

Portfolio & Website – CV Design Progress

I have developed my CV over the past few days following on from the tutorial with Jay. As mentioned, before I have gone for the CV design that used the coral as an accent colour rather than as a bar across the top. This is to link it between to the design of my website & portfolio. I have changed the dot of the marque to include the coral colour to match the developments made on my portfolio. In terms of content I haven’t changed anything.

Screenshot 2020-06-03 at 14.24.50

Screenshot 2020-06-03 at 14.25.08

I have experimented with the placement of the marque and my contact details. I have tried having them in line with the three columns to see if the balance of the document would be better. I found that it seemed like too much white space at the top of the page. I also thought that with the marque about the column would be better as I wanted there to be a clear hierarchy system within the document. Therefore, I made the decisions to keep the marque left aligned and about the height of the columns. However, using the base line grid I have no aligned the contact details so that they match the rest of the text on the cv.


Overall, I think that these small amendments to the CV have helped to create a strong CV that links to the design of my website and Portfolio.

Portfolio & Website – Portfolio Design Progress


After receiving the feedback from the group tutorials and sharing the work with Meg and getting 1 to 1 feedback from her, I knew there were still elements of my portfolio which needed adapting. One of the suggestions I had was to place the voluntary work I had done for FourMutts in the same section as the persuasion project as it would show progression. As the voluntary work was focused around managing their social media, I also added the social media handles to this page.


Furthermore, during the final review I asked Jay whether it would be appropriate for me to include a piece of concept work which I completed during my work placement. He said that it was perfectly fine to include, even though it might not be in production and it was only a concept many designers include work like this. I added this piece of concept work to my portfolio, as I felt that it was a high-quality concept design and would add more variety to my portfolio.

Screenshot 2020-06-03 at 14.12.38Screenshot 2020-06-03 at 14.12.54

As Jay mentioned to me previously about adding the coral colour into the portfolio, I have done this via the subheadings. This creates a link between the portfolio, website and CV. It was also suggested that I try adding the coral into the marque. I didn’t want the coral to be overpowering however, I thought that by adding it to the dot would be a subtle yet clear link between the marque and the coral colour scheme. I also tried adding it to the dot of the ‘I’ in my first name. However, after much consideration I felt that it didn’t look right as I would have to added it to the 2 I’s within my surname as well.

I also added a more information heading where people would be able to see more about the project. It links to my website page where they can see more images as well as video content that I might have created for the project. I thought it was better to add one clear link where people could find everything than have a lot of different links throughout the portfolio.

Screenshot 2020-06-03 at 14.17.55

For the contact page I thought that it would be interesting to see what it would be link to add the icons for the social media/email in the coral colour. I wanted to try and create some more links between the website and portfolio. The social media links on the website are coral colour which is why I thought that it would a good link. Also, I made the links quite large as I wanted them to be clear but also, they act as the imagery on the page as well.

Screenshot 2020-06-03 at 14.18.17

I still wasn’t happy with the navigation element of my portfolio. I felt even though the use of words made it clear to people how to navigate, it didn’t have the look or feel to the portfolio that I wanted. Originally, I had used icons for the navigation buttons, so I thought back to these. However, instead of using a home as an icon I thought using my marque would be better. I then used two arrows which weren’t as bold in design to allow the used to navigate through the portfolio. The arrows are simply to lines with a curve head of the arrow to try and match the softness of the typeface. Overall, I thought that this was better to show the user how to navigate while fitting in with the style of my portfolio.

Portfolio & Website – Development & Final Review

The main parts of development now were the content of the portfolio & website. I wanted to ensure that there was a change of pace within the portfolio in order to keep the viewer engaged with the content. To adapt to this, I added some images which covered the full page to break up the smaller images. As Jay mentioned that he felt the portfolio and cv didn’t link, I decided to change the colour and typeface of the headings so that there is a more subtle link between the two. I also have made this a feature on my website with the heading there also being Abril Fatface and in the coral accent colour.

By making these few subtle changes to the portfolio and website have helped create the link between them and my CV. It also meant that I had a language which I could use across the different platforms. Furthermore, for the contacts page I added some icons to in the coral colour so that they were clear to the audience which contact detail was which. I thought this was a nice addition to the portfolio, and again it linked back to the website were the social media icons are also in the coral colour

Final Review

In the tutorials this week it was timetabled as the final review before hand in, I had everything ready to show as I wanted to get clear and constructive feedback on the work. Overall the feedback was positive, and all the feedback Jay had given me on Tuesday had been worked on. He did suggest that I maybe see if I can add the coral colour to the dot in my marque to see if the link could be made there. This is something that I can try as I think that it would be a nice addition to add to the marque if I can. He also mentioned that one or two of the larger images I had added in weren’t working as well, they were too dark.

Furthermore, we also talked about me adding in some of the work I had done on my work placement in January. I wasn’t sure whether to include this initially as it was just concept work. However, Jay said it was still important to include as its work experience a mini project even if it hasn’t been used in production. We also talked about combining the voluntary work and the persuasion project work together. As they are both the same client and it would allow the viewer to see the progress and connection between the two projects. It was also mentioned that I look into a custom domain name for my website as this would be better for professional practice. This is something that I am going to look into and include in my developments.


Portfolio & Website – CV Design & Tutorial

After researching into CV design I decided to play around with a few designs in InDesign. I used a 12 column grid system with 10pt baseline grid as I knew there was going to be a lot type on this document so it was important to use a baseline grid to have all the line in line with each other. I started to introduce this coral colour into my scheme as an accent colour. I used this on the headings to make each section clear to read. The main sections I have are; About me, skills, employment, experiences, education, references and contact me. I completed a few different variations including using a bar of colour down the left hand side and top. I wanted to experiment with different layouts to allow me to grab the best elements of each and bring them into the one.

I had an individual tutorial with Jay where I was able to get his opinion on the CV Design in particular. When we spoke Jay felt that the two designs with the bars of colours seems too out there in comparison to the layout of my portfolio and website. I haven’t yet incorporated the coral into my portfolio design but Jay felt that a more subtle approach would suit my style and layout better. He also felt that at the moment the CV, Portfolio and Website weren’t working together they seemed to be quite separate when they needed to be linked in some way.

This tutorial was really useful as it helped me to see they where my work wasn’t working together. I wasn’t able to see this before but after jay mentioned it to me I started to see that the elements worked alone but not together as one piece. I was also able to speak to jay about writing the speculative email as I had a query regarding how they wanted this presented.

Portfolio & Website – CV Design

Another deliverable we have been asked to create is a CV. I think that it’s important to have one of these as it helps with getting internships or work placement while studying. Creating one now will also help next year when it comes to getting stuff together. I have created CV’s before for when I have been getting part time work however, I haven’t created a design based one before.

I decided that by looking at some examples of CV’s would help me to see what should be included and what design elements are similar. We’d be provided with two examples on moodle, these were done by previous students. The both held similar information on them, starting of with who they are, writing about what they like, where they are from. This is an important element to have because it will let the person reading the CV to know more about you as a person. Both of the examples also talked about their education, experience, skills, and contacts, these were the basic contents of the cv that I was expecting to see.

Screenshot 2020-05-25 at 11.42.35Screenshot 2020-05-25 at 11.42.52

In terms of the aesthetics of these two examples they were very different. One include a picture of the individual on, while the other simply used their branding. I think both approaches are good, the idea of using a picture allows the reader to put a face to the name. Whereas the branding shows an element of who you are without the picture, and shows your skill in branding. (Especially good for applying for a junior design position). Personally I think I would prefer to use my branding on the CV over a photograph.

There is a clear layout in the CV designs using subheading for each section to make it easy to read. I like that these are often in an accent colour to make them stand out. There is a clear hierarchy system in both of these designs, with the main heading being the name of the person. I will need to ensure that my name is clear and bold much like my branding. Also, both example have been designed on a landscape template. I think this has been done so that anybody who opens the CV up on a computer or laptop is able to read it easily. This is something that I need to remember when designing my CV. Furthermore, both of these CV designs include a small detail in the corner of the page. I think that this is a nice addition to the design, on my portfolio I have used my marque in the bottom right hand corner so this is something that I could utilise in my CV as well.


  • Poppy Reay. (date unknown). Designed CV. [Accessed: 22 May 2020].
  • Tom Temple. (date unknown). Designed CV. [Accessed: 22 May 2020]

Portfolio & Website – Tutorial Feedback

Today I had a teams call with Jay and my group where we looked at the progress we had been making. It was only myself & Ellie who joined the tutorial with Jay so we were able to talk about our work in more depth. Overall the portfolio feedback seemed really positive with Jay saying it was consistent in terms of the style, and the choice of typeface worked well and stands out. He also said that the variety of projects made the portfolio different, the pace changed with each project which is positive to hear. Both Jay and Ellie liked the style of the big heading used on the contents page and the contact page.

Obviously theres still room for improvement with the portfolio. The image used for the penguin project needs to be moved slightly as at the moment the image of the book is too close to the text. Might be worth add a few more larger scale images into the pages just to change the pace in each section of the portfolio. The rest of the feedback was just about refining the work in there now, the navigation and layout works really well. This was useful feedback as it gives me something to work more towards.

I also showed my website during the tutorial and feedback was relatively the same. The layout worked and was consistent with the portfolio style. It just needs to be refined in terms of content, getting the about me section up to date as well. Ellie also mentioned about a custom domain name and whether this is something extra I would have to pay for with Adobe. I didn’t think about this so this is something that I need to think about in more depth.

Next Thursday is timetable to be the final review of the work before hand in. Jay has encouraged us to work towards being able to show all the work on that Thursday as a review. This gives me some sort of deadline to be aiming for in getting the refinements complete.



Portfolio & Website – On Display Developments

As part of the final submission we are asked to submit 3 research and development (R&D) PDF’S, which have been developed based on the formative feedback we have received. I had a few developments to do on the branding project we did this year.

Marque Development

One piece of feedback I had was about the development of the marque for the project. In my R&D file I hadn’t shown my full process of getting to the stage of the final marque, which meant that they thought that I had quickly settled on the first idea which is something we had discussed during tutorials. In order to ensure that they could see my development I decided to include more of the rough workings and sketching in order to show that the marque had developed much more than they first might have thought.

Marque Ideation 2

Promotional Installation

I also had feedback on the development of all the outcomes, they could have been developed further. One outcome in particular that I wanted to showcase better was the promotional installation. Originally I had used Adobe Dimensions to showcase how the idea would look, but it didn’t convey the idea as well as I hoped. As I had previously made cardboard models as part of my A Levels I thought that this would be a good way to showcase what I imagined. I created the exhibition space out of the cardboard and then photographed it to highlight how it would look. I thought that overall this was a better way of showcasing the idea. Through the model I was also able to showcase how the mirrored lines on the floor would act as way finding paths to help those visiting the exhibition navigate around the space.

However, upon reflection, I did some more ideation around the promotional installation. I had the idea that instead of having the screen on the floor why not have smaller billboards which people look into which puts them into the uniform. It would be like having free standing mirrors at the entrances to the exhibition. I did some research into the virtual artists that Sephora use within their stores. They have these screens in stores which allow you to see what you’d look like wearing different products of theirs. This similar to what I am proposing the promotional installation would be. Another campaign I came across was the Share a Smile Campaign by Grand Visual. They used facial recognition technology to get people to smile at the screen if they smiled it would dispense a can of coke. I hadn’t heard about this type of campaign before and it’s something different a good way to get people to interact with the product. Furthermore there have been other campaigns out there which have used AR technology to get people to interact with the brand. O2 goslings campaign used AR technology to place ducklings on the screen when people were near then and asked them to take the a selfie and share with the world. This shows how effective this type of technology is in getting interaction. I could see this type of technology working really well within the the context of my exhibition space.

I wanted to show how this could work in more detail, by creating a prototype of what the AR technology might look like. In order to showcase this idea I used Lens Studio which is a piece of software which allows you to create snapchat lenses. This is just a very basic idea behind it, it would be better put together if the exhibition were to be live. I used a cap which I already had at home to photograph it before taking into photoshop and creating a PNG file to import into the software. Using a face sprite I was able to position the cap as a 2D object onto the face. I haven’t used Lens Studio before which meant that I only had the basic understanding of the software, with more time I could create more complex outcomes. I think it’s a useful piece of software to know about because you never know when you might need to come up with something that involves mockup up AR technology.

Screenshot 2020-05-27 at 13.49.26

Once I had created the lens I was able to record somebody walking up to the camera like they would to the screen on the street. Due to the current climate I wasn’t able to attend the haze to film this clip, however, I was able to film it to show the basic principle of how it would work. Using a Digital mockup I was able to show how it would look in-situ.

Screenshot 2020-05-27 at 15.21.00

Animated Marque

Another piece of feedback that I had on the project was about the animated marque. Aesthetically the url that I had used as a touchpoint was too longer and seemed out of place when everything else was contained within this square shape. This was a smaller development to the project as I was able to go into the original file and edit this easily.

Screenshot 2020-05-06 at 15.52.08


Rayome, A. (2018) How Sephora is leveraging Ar and AI to transform retail and help customers to buy cosmetics. Available at: (Accessed: 21 May 2020)

Grand Visual (2020) Share a Smile. Available at: 21 May 2020)

Grand Visual (2020). Advancements in Augmented Reality Technology: What to Expect for 2020. Available at: (Accessed: 21 May 2020)

Portfolio & Website – Development


I have been developing both my interactive portfolio and website over the past couple of days. With the portfolio I also included the client work that I had done with Ellie and the 48hr project we did in groups at the beginning of term. The most recent development that have done is changing the navigation tools. I changed the navigation icons to words making these the buttons rather than the icons. When looking over the icons I didn’t feel that they were matching the style of the rest of the portfolio that I had made.

I continued to used my portfolio from last year as a guide for layout, last year for each project I include which software I had used to within it. I thought that this would useful within this project, so I have included it within the type. I would also like to include more images that fill the whole page as these were key within my last portfolio showcasing the work without type around it. I have also developed a contacts page, which has my email and other contact information so that clients can see more or my work or get in touch.

This slideshow requires JavaScript.


In terms of the website I have been developing in Adobe Portfolio. Using one of the templates provided I was able to manipulate it so that it started to give me the look and style I am after. The homepage has my marque in the centre at the top with the navigation to the left hand side while there are links to my WordPress and Instagram on the other. I have used thumbnails of the projects for people to click on to view more about the project. I have kept it consistent with the style of my portfolio.

Different projects have laid out differently in terms of the content being shown. For example in the identically different sections there is more content being shown than in the penguin project. This is mainly down to the types of projects being shown and how much work was produced for them dependant on the brief.

I have also included a contact page and an about me page where anybody viewing the page can go to see more about me or get in contact with me if they need too. These pages aren’t yet developed completely but this is the next challenge for the website. I also think that the next stage of this is purchasing a custom domaine name for the website. This will allow me to be more professional.

This slideshow requires JavaScript.