chroma

Posters insitu.

Image on the left: The text needs to be pushed up at the bottom to allow more room for cropping.
Image on the right: Same applies, the whole canvas needs to be ‘shifted’ up to make the gaps even at the top and bottom of the page

Image is very clear to see and read from a distance

I decided to mock my pictures up on billboards and posters, as I would like them to be advertised. Doing these mock ups helps me to see what is good and what needs to be improved on the posters, considering the fact that the posters need to be easy to read from a distance.

Final adjustments

I could still see in this poster that the type at the bottom was quite close to the edge, so I have decided to shift it, leaving a much more even gap at the top and bottom of the page.

Final adjustments

Similarly to this photo. I wanted to use up a little bit more white space that was on the page, so I decided to centre the web address to allow it more focus, as well as bring everything up evenly. I also moved the logo to the top right hand corner, giving everything more room.

Here are the adjusted posters fitted insitu with how I would like them to be presented. I’m really happy with how they have turned out so far, and with the small adjustments made, it makes a lot of difference to looking at the pictures.

Taking my posters further Part 2.

I tested out my posters to see if they still worked in black and white, and to my surprise the posters I thought looked better than in colour. The text is still just as clear to see, and because of the hues merging in some of the colours, the text appears clearer to see.

Protanopia

Deuteranopia

Protanopia

Deuteranopia

Protanopia

Deuteranopia

Even in the colour blind mode, the posters appear to be clear to see and the patterns are still clear to distinguish. Because it is so important for my brand to be clear to see to my target audience, doing these tests shows that the design of the brand has taken the target audience carefully into consideration.

Making my website.

From my research I did a quick mood board to present my ideas of how I might want my website to look like, and to see how I could incorporate elements of each design piece into my own practice piece of work.

I also did some quick experimentations to see how my logo would work if I were to place it against a black background. I wanted to see if this would work because it would allow me to play around more with my logo for anything else I may do for my project to develop it.

I made up two designs for my website from the mood board and mocked them up using InDesign and Photoshop. I wanted to mock up both of my ideas to give me a better understanding of what both of the designs could look like if I were to make them realistically.

Muttonhead inspired the first idea I did. I tried out the banner on the left hand side, and I kept everything neutral. I did not think this design piece would have worked as well for my style of work however. Although I like the design, I felt it did not suit the theme of my website design, I felt the whole design needed to be far simpler in the layout.

Looking at my website through a black and white desktop.  The logo is still apparent and the overall appearance is still clear.

Looking at my website through a black and white desktop.
The logo is still apparent and the overall appearance is still clear.

Moreover, I was considering those who may be visually impaired, and they may not be able to navigate easily with this banner on the left hand side, which would defeat the aim of my project for everyone to be able to access everything easily and independently.

Website template - First version

Website template – First version

I then designed the second sketch, which I felt came out far more successfully. I liked the idea of merging the pictures in a tight grid format, as this allowed me to use up space effectively without having too much content on the page. Because my website will be basic enough to only present what will be shown, I thought this would work well with it.

This slideshow requires JavaScript.

Website template - Final version

Website template – Final version

Website template - selected new in

Website template – selected new in

website template 2 Black and white

website template 2 Black and white

After tweaking the first design slightly, I came up with this final concept for my homepage. I really liked how minimal I had kept everything, and only allowing colour to be shown in the pictures, search bar and logo.

Someone who was colour blind that it could be a nice concept to include the black and white logo design as you hover over it, allowing some more interaction on the page in a discreet way, also advised me. I thought this worked really well with the whole layout, as it shows both of the types of logo designs that are accessible for everyone to see.

As you hover over the images also, there will be a radius of when you can click on the image to navigate you to that page, as I know there are no gaps between the pictures, it can be easy to select the wrong image by mistake. This way, it prevents errors from selecting the wrong image and for easier navigation.

These are my final homepage concepts. I think they work really well and they blend with the other minimalistic trends that websites are currently following. The whole theme is simple and it allows the clothes to be the primary focus. What I intend to do next is to start working on my pages, and to begin thinking how this can be condensed to work with smaller screens within an app on a mobile phone. What I also plan to do is make a mock up of the whole homepage screen, which I will try to turn interactive using Invision.

Research for labels and tags.

Because I want to add in my own labels and tags for my branding, I decided to have a look at some of the styles to give me some inspiration. I found a few online methods of designing my own tags including making my own, iron-ons and ordering my own personalized tags.

I had a look on Google at different clothing tags and their styles, and I thought it would be better to design a range of different styles to fit the style of clothing. Because tags on ranges of clothing differ according to the size and shape of the clothing, it would be better to consider this.

Maybe same design on tshirt on tag? Include code, name of colour

Maybe same design on tshirt on tag?
Include code, name of colour

I then went on to explore QR codes and applying them on the clothing tags. I thought this would be a good concept to use for my design idea. By doing this, people can scan the code using the app and view the clothing item, as well as helping them find what they can wear with that item of clothing within the same store that would be automatically located. If it is not available, then they can save the item of clothing and/or order it online.

The idea of the QR codes also influenced me to think about making it more personal to people. If people signed up an account, they can have their own QR code, which could be scanned every time they shop. This way, their clothing can be emailed to them along with their receipt, which they can choose to save on their account if they wish to do so.

The benefit of including this idea is to make their shoppers experience more independent and personal to those who are colour blind, as well as helping people who are colour blind to find their clothes easier with easy identification.

http://www.stickeryou.com/2/products/iron-ons/617/

https://www.etsy.com/uk/search?q=perforated%20clothing%20tags

http://www.instructables.com/id/DIY-Make-Your-Own-Clothing-Labels/

https://www.bagsoflove.co.uk/custom-fabric-name-labels.aspx

Testing my logo Ishihara style – further experimentation.

I was determined to make the Ishihara test work to enable everyone to look at the same image with different perspectives, so I first tried changing some of the coding on the software to see if I could get the colours and the sizes of the circles to differentiate slightly more, however it did not go to plan when I had put it into Photoshop and grescaled the image again.

I realised to get the image in the greyscale setting to show, I would need to up the contrast from the colours even more, meaning I would need to change the colours of the image where the logo is becoming Ishihara.

I changed the setting on the software to ‘viewable to all’, meaning the colours that came out supposedly allowed anyone with any visual deficiencies to see the image. Although this did not work using the settings given, I changed the levels slightly in Photoshop to allow maximum contrast between the two set colours, which made a huge change to the image.

After testing out the image in greyscale first, I then changed the settings for colour blind, and then normal perception. Each one seemed to work perfectly with each other. I was really happy with this outcome, as this now meant that I could not only develop my logo to creating all different outcomes for people to see the logo in different stages, it has also enabled me to be able to present the logo in this style using one picture.

I tried the same technique using smaller circles to make up the logo, and the outcome came out exactly how I had hoped it would. Knowing that this method has not been put into practice before, I felt this was a huge challenge that I had accomplished, and I feel extremely relieved that it had worked. Using smaller circles to make up the image Ishihara style makes the logo clearer to see from a glance, but it still means you need to look at the image to ‘join the dots’ to see the image as a whole.