Wednesday, 3 April 2013

Graphical Inspiration - Yiying Lu


This is the work of Yiying Lu. She is an artist based in Sydney, Australia. She has a similar style to that of Christopher Lee however, her style has less of a hand drawn look to it and is more mathematically and anatomically correct in my opinion. Although I prefer the style of Christopher Lee I think that this is probably closer to what I will end up creating for my website and iBook. The reason is that it is still colourful and unique however, it is a little cleaner and more anatomically/scientifically correct. That is an important aspect highlighted by the brief. 

Her website contains a gallery of her work including the Twitter "Fail Whale" that brought her a certain amount of notability. She has quite a diverse and broad spectrum of styles that can be detected in her work. It is blocky and vibrant however, the degree of vibrancy changes a lot from piece to piece as does the complexity of the shapes and intricacy of designs. 

As you can see if you compare this:

To this:

The first is far more subdued and and intricate whereas the second is sparse, simple and very vibrant. I think that the first style is much more fitting to the images I have in my mind and so that is what I can see influencing me the most.

Overall her work is really accomplished. I love the colour choices she has picked for most of her designs and I think the more complex, mathematically perfect designs work the best. I want to try and combine both Christopher Lee's colour choices and graphical identity with Yiying Lu's more anatomical, scientific drawing accuracy and more computerised, perfect looking vector style.

Graphical Inspiration - Christopher Lee



This is the work of Christopher Lee. He is a graphic designer based in California. He draws with a really unique, vintage, cartoony yet tactile style. It is hard to describe. His style is both vibrant and simplistic. It is what I aspire to come close to replicating for my work. I want to combine small, vector graphical elements in this style with a structure and feel similar to the Boston Globe website I looked at earlier. I feel as though if I handle it correctly it could work really well.

Here is a link to a gallery of his work:

The colour spectrum he utilises is very fitting to the colours I had in my head. They're soft, pastel colours coupled with splashes of much richer, more vibrant colours. This works well to create a nice overall feel whilst still highlighting a particular area or object. This is something that works really well and I can use this technique both in my images and also in the text. I can choose a key colour that I can use throughout my designs as a highlight colour. This will strengthen my brand identity.

His drawing style is quite vintage and cartoony. I think I may have to adhere more to anatomical proportionality and more photo real objects. This is the only major draw back with his work is that it wouldn't really suit the brief of a website containing A level content. However, if the text and other information is at a high enough level then this style of cartoony drawing may in fact add something really nice to the site and work really well.

My main problem with academic texts and sites is that they are either way too text heavy and bland. It is usually the colour spectrum and image choice that lets them down. I think that with a more vibrant colour spectrum and unique art style I could really bring a new and successful flare to this genre and create something really engaging.

I will also use the same style and ideas in the iBook. This if anything adds more freedom with this kind of style. I can have larger images and really go down a more playful, creative, interactive route with the iBook as it isn't as conventional and established as a website and it is still a relatively new form of media distribution.

iBook Inspiration


This is what I found most inspiring in terms of iPad technology. I love the simplicity of function that bears within such complexity and depth. It makes a usually scarily daunting topic to delve into so inviting and easy to use. I love the layout where there is a large image on the left hand side with the detailed information along the left. It is so interactive and playful and really makes the subject that is usually boring very interesting and fun. 

It does well as hiding depth that isn't baring at the front and really distracting however, if you want the information it is only a touch away. It really is a masterclass in interactive iPad design and definitely something to base my iBook upon.

The style is very harsh, contrasty, dark and scientific. I am looking to go down a much brighter, friendlier, inviting route with my design. That is going to be the only major difference though I think because I do really like the functionality of the design and the structure of the app as a whole. It really works.

It also deals with shifting perspective very well:


I think that because of the time frame I have for this project, I am just going to commit to one orientation but it is good to know that this app is successful in both landscape and portrait. I shall look into this further before finalising the orientation I am going to go for.

This app is really exactly what I was looking for. The iBook seemed alien and different because I'd never encountered one properly before. I think I was a touch daunted by the seeming difference from the web and I didn't, at first, feel as though I had a leg to stand on to start designing. After a bit of searching around and discovering this app I feel as though it is a lot more manageable. This app is exactly the structure and level of interactivity I think will compliment the graphical style, the structure, the colour space and the nature of the way I am going to tackle the topic. I am excited to start applying my ideas to this structure.

Responsive Website - Clean Air Works!


This is the third site I found. I love the look and feel of this. There aren't really set columns. The whole site looks like a single column that was centred. I love the simplicity and graphic style of this website. The vector aspects really pop along with the really vibrant colours. I must say that I do feel as though I prefer The Boston Globe sites design a little more than this one however, they do both work. I think that combining vector elements, similar to the ones on show in this site, with the look ad feel of the Boston Globe site would be really successful and make the vector elements really pop against the background. 


This is the site at portrait tablet size. As you can see the sites structure doesn't shift too dramatically however, a few things do change. The main thing that changes is that the bottom navigation bar does pop up so it is not longer on a rollover. This is interesting as it is something I often feel I overlooked when thinking about design and structure. When on a touchscreen tablet like the iPad you loose the ability to have a rollover because there is no rollover state with your finger. This is something to remember that I need to not only shift the structure and size of the site I also need to take into account the various differences and limitations that come along with device shifts.


This is the site at portrait iPhone size. It goes absolutely single column and frames the content really nicely. This is similar to the Boston Globe site and reinforces in my mind the fact that I want my site to do the same at smaller sizes. I also really like what happens to the nab bar and maybe something to consider when I create my site. The only limitation with this is it takes up quite a lot of real-estate when coupled with the logo and title at the top. 

Overall I think that the graphical style and colour spectrum of this site coupled with the sophistication and structure of the Boston Globe site would combine to make a really successful and pleasant to use, engaging website and I am excited to begin trying to figure out how I can best make that a reality.

Responsive Website - Grey Goose



This website is a website for a drinks company called Grey Goose. Their website is very simplistic however, instead of being heavily text based with simple, limited colours it is heavily image based with more vibrant colours. They still share aspects that link back to my original ideas. For example they both have neutral, simple colours and both share a very blocky, square look to them. This is the website at desktop size as you can see it is very simplistic in terms of column count and also is predominantly one big image. This is interesting as it still adheres to all the structural aspects that I liked about the other design however, tackles them in a completely new way and has a completely different look and feel.


This website only actually has one break point and that is to portrait iPhone size. The lack of columns at larger sizes means that it can just simply scale down to tablet size without having to cross through any break points. At this size it goes down to a single column design which is 100% width. There is some padding around the text however. I am not really a fan of this. I like the idea of all the content being in a single block down the page. This has reassured me that I want there to be a little bit of space around all elements at all times and, similar to The Boston Globe site, never actually go to fully 100% width. 

All in all this site is really nice and does work well. The responsive design is quite limited which simultaneously makes it really simple and strengthens brand identity however, it does make it quite odd at some sizes and would probably benefit from some break points.

Responsive Website - The Boston Globe

I wanted to look at simple, narrow, blocky websites and how they handled responsive layouts. From the beginning I knew that I wanted to try to create a simplistic, modern (yet classic) feeling website. To inspire myself and also to see limitations and mechanical properties I thought that trying to find websites similar to what I can envision creating would be a good idea. With that said the first website I found was The Boston Globe.


This is the site at desktop size. As you can see it is a 3 column design with space around the left and right sides. This is something I like I toyed with the idea of having a 100% width design however, I think this is more classic and pleasing to the eye. I love the fact that there is a clear edge to the content. The images and navigation really create a solid idea of a frame that I really like. I also really love the colour scheme. It is so simple, classic, sharp, sophisticated and strongly linked to the idea of  newspaper.


This is the same site at portrait tablet size. The layout stays three columns but now it more or less 100% the width of the screen. This is quite nice looking however, I might try to have fewer columns, thus freeing up more space either side of the content.


This is the same website at portrait iPhone size. It jumps down to a single column and is now again more or less 100% width. Also the navigation bar retracts to a drop down menu rather than a series of words. I think this looks really nice and simple and I think 100% width at this size really works. I also like the simplicity of the nav bar after the jump and I at first was hesitant to say I wanted to create a drop down nav structure at this size however, if I design a custom button that I am happy with then I think that it might be a sensible idea.

All in all this site is very clean, spacious and aesthetically strong at all major break points. I think that this is something that will heavily influence my design and content structure.

Tuesday, 19 March 2013

AF103 & AF106 - Oceans

This time around the brief is to create a responsive web site along side an iBook. They have to share design principles and share mostly the same content and they both need to be based upon an assigned topic from the natural world. As a class we drew numbers from a hat. These dictated the order in which we could go up to the computer and choose a topic. I was first and chose forests however, I advocated that topic to another classmate later and instead, chose oceans.

Although it wasn't my first choice I am glad I have it. It shares the same component that initially drew me to forests, and that is wildlife. This makes it not too drastic a shift in direction and a lot of the things that drew me to forests are also relevant with oceans. 

Blog Archive