Wk 9.1 Interim One
Interim Presentation
The interim was helpful for us as we saw group projects that were similar to ours, as well as ones that weren't, but that had cool ideas, such as really good sitemaps, and awesome animatics.
Feedback:
- mini worlds, go in depth as to what is there (living creatures), like when you lift a rock at the beach and there are so many different critters underneath it
- what is under our footsteps?
- illustrator produces flat graphics, could look at doing entire animation with watercolour paints
- could paint, or make out of coloured paper a long, wide background to move over
- could print illustrator background and paint over top
- cut out leaves and plants from coloured paper, these can be moved easily (more of a stop motion)
- use textures from photos and add into illustrations to bring more life and interest to them
Our next steps are to trial some of these illustration styles, as well as continuing to work on the sitemap and possibly get this into figma. During the lab we will make our storyboard into an animatic. As well as this, we are both going to look for website design ideas that we like.
Web Precedents
This design incorporates the natural aspect of the forest that we are focusing on in our project. The site uses layers and scroll speed and direction to create a 3D interactive experience with the viewer.
Here this site uses an Illustrator style design for a theatre site. It creates characters and uses them in a playful way, using mouse direction for the viewer to be able to interact with the characters - moving them across the horizontal axis. Additionally the colour palette for this work is vibrant and engaging, similar to what we are striving for in our work.
Although this doesn't stylistically fit with our intentions, I like the way this theatre site sections the different aspects to each play and where the scroll only moves the text box on the left-hand side of the screen, keeping the imagery front and centre in the composition. This could be a good layout to bring into our work.
This design uses a simple tool where the first few scrolls enlarge the main page photographs, and then when they are at full size we get to move down the screen. All of the photos move when hovered over, and the mouse tool becomes different icons. I also particularly enjoy the colour palette, and the custom loading screen which is an owl - this reinforces their brand. The layout is minimal and simple, but super effective.
This design is quite different to the pastel, more subtle website above. I would still describe the style as reasonably simple, yet it doesn't feel minimal because of the loud colours, and typography that shouts at you. I really enjoyed this site as it engaged my interest from the get go. Again, they have interactive photographs, but the type also says something different when hovering over different images. I also like how the background colour changes as we scroll down; this keeps me interested, and also feels like I have less to read somehow.
One thing I don't like about this website is how some of the type moves around, like it is on a boat. This is really clever as it reinforces their brand, and their company, but for me it was a bit sickening and made me scroll straight past it.
Illustrations
This is a quick mockup of one of the frames from the motion graphic, drawn in illustrator by Lauren. We both agree that there needs to be some texture in there, but we disagree with Klaus, as he said that we shouldn't be using illustrator at all. Lauren will add some textures into this image to see if we can achieve what we want with this program.
Here I added some textures sourced from photographs. I made them look more abstract using blending layers. We both think this is really valuable on the plant, as it adds more depth and liveliness. We are also both in agreement that the tree trunk looks a little weird. Ellie doesn't like the dots of the water texture because it doesn't convey enough movement, but I like it because for me it represents bubbles and it gives the stream a much more watery feel. I also think the movement is conveyed enough with the abstract blue and purple wave shapes. I think I will keep playing with this texture.
After adding these textures, I was strongly reminded of a series of books I used to read as a child, called 'Charlie and Lola' by Lauren Child. The illustrations in these books are half drawn, and half using real photographs for texture. As a kid I really enjoyed this technique as it was interesting to me. I feel like I could draw inspiration from the illustrations, and work with this sort of style.
Adding texture with different brush tools in Photoshop. I also really like the look of this, though of course the brush strokes in the pink would be in the background (I couldn't do this seeing as I'm working on an Illustrator file in Photoshop). I think my next step is to have a go working entirely in Photoshop and see if it differs in any way - for better or for worse. The only thing I'm worried about with working in photoshop, is that the illustrations won't be vector and therefore can't be sized up easily. If I start with the right size though, this shouldn't be an issue.
Ellie is looking at the hand made illustrations, with paper and paint.
This composition took me an evening to put together, which seemed like a lot but in the scheme of things wasn't too bad if we have about 2-3 compositions (land, water, sky and transition) for our final. But this would be hard work to keep up with developments and changes. What I learnt through this composition is how I like the surrealist style of crazy coloured plants and the streaky clouds. However the textures added in photoshop in Lauren's work above is really nice and embodies the song 'Home Land and Sea' well. This work makes me less afraid of what Klaus was saying about Illustrator being flat as these bright colour combinations are engaging and buildable, something we can bring into a more time efficient program.
The painting was a therapeutic mode to test! However I think that my painting skills aren't quite up to standard for a final project. The textures and tonal changes in this work is nice and we could possibly work to combine these in with photoshop to add depth to flat colour layers.
Our decision after doing all of these tests is that we will primarily work in photoshop. Ensuring the illustrations stay sharp (cutout style) and have bright/wacky colours. That being said we both agreed that the water scene should be normal colours. We want to bring in subtle photographic textures and possibly use textures from paint if we want more variation. One thing we hope to experiment with is giving the layers and elements in photoshop depth, a raised or layered effect through colour contrast and perhaps a slight drop shadow. Our next step is for Lauren to create the characters (fish, dragonfly, bat, bird etc) and I will generate the water scene to then move into our animation!
Sitemap
Post interim I set out revamping our sitemap to include more pages, interactivity and depth.
My next step was to bring it into Figma, as I feel more under control of the site there, and start linking the buttons! After finding some of my artist models I created this (wasn't that pleased but it was something) and will revisit this later in the week when I have time to refine and incorporate Lauren's ideas also!
Comments
Post a Comment