GDES2000: Blog Task for Tuesday 29th Nov

As mentioned in the last session, I'm away in Manchester at the UCAS Recruitment Fayre for the University next tuesday so I said that instead we'd build on what you all did this week and get you to create mockup 'home' and 'inner' pages for your chosen GDES2000 brief [Beeline Fest or Museum]. The requirements for this task are as follows:

DELIVERABLES

Mockups Task for Tuesday 29th Nov, 2011

• Create a total of 2x mockups of what your web pages might look like in Photoshop.

• No. 1 must be your anticipated design for how your 'homepage' might look.

• No. 2 will be what your anticipated inner page style might look like.

• Each page in photoshop must be setup as we discussed in the session spec-wise:

- Size: w800 x h600 pixels [landscape].

- Colour format: RGB [for screen not for print so don't do CMYK].

- Document resolution: 72dpi [for screen not for print so don't set it to 300dpi]

TIP: When creating new document in Photoshop set it to 'Web' in the preset drop-down. Then select '800x600' in the size drop-down..

TIP: Think about a simple grid layout as you would a printed page design [i.e. 3 or 4 columns] and then lay this out using Photoshop's rulers. This will help keep your designs clear and well laid-out.

TIP: Look at the 2x 'Bickerton' page mockups I discussed in the last session which are linked on the module's timetable page [here].

Hand-In

• Please simply attach both of these images as a .jpg [make sure you file > save for web in pshop -medium quality- and save as a .jpg] to an e-mail to me.

• [Andy St Group] These e-mails will be timed and dated, to meet the day's deadline this must be in before 6pm on tuesday 29th Nov. I'll be recording who gets work in and when for my assessment notes.

N.B. Andy Sc group - Andy will advise on his wants by mail.

What then?

• Once back from Manchester I'll be uploading each of these on the blog and will comment on each person's work to date.

• I'll also send the blog post and your ideas to date to your clients for further comment too.

Andy Stevenson Group: Made Deadline

 Adam

 [Andy] Useful mockups here Adam, I can see where the various elements would sit in the page as it develops. Clear thinking regards the yellow and grey, good incorporation of typo consids and the Beeline imagery supplied to you.

Jesse

[Andy] Good mocks Jesse - well done.. Again, I can see how you've thought in terms of layouts, grids and subtle colours.. Be nice to see this evolve..

Spencer

[Andy] Simplistic layout at this moment Spencer. I can only really see where their basic elements are - we need these to be more of the graphical standard that either Stephen, Adam or Jesse has supplied really at this stage.. Do supply again and I'll replace this one - make sure that the imagery tallies with the spec above [72dpi, RGB, 800x600 pixels etc].

Matt Maynard

[Matt] Please find enclosed my two mockups of the screens. Still pretty rough but developing them as we speak.

[Andy] I can see where this is going Matt and like the use of textured backgrounds and illustrations of characters etc.. Seems to hold much potential - good.. To refine further suggest that you show where picture elements might be and where multimedia elements might sit - just helps with our understanding of how it would work..

Kirsty

[Andy] Very, very simplistic Kirsty unfortunately. It doesn't seem that much time has been spent at this stage in creating a layout of the type I discussed in the session.. I'd suggest that this really needs re-supplying to me as a more refined set of inner and outer layouts mockups [along the lines of many shown here such as Adam's, Stephen's and Sophie's]. Additionally you neglected the task requirement for a 72 DPI 800x600 image and supplied this to me at 300dpi..

Kirsty Mk 2

[Andy] These are much better Kirsty.. You've used the imagery much more effectively and I can see better the various elements that you intend to go on pages - text/images etc.. The challenge now is to take one or more of these mockups to DW as we did in session recently with the 'Ducky' page so you can display this at the peer assessment pre christmas.

Peter Lee IOW

  

[Peter] Just a couple of notes about my items...

- This is for the more adult focused pages.
- The text 'Beeline Storytelling festival at the top will be a Marquee perhaps
- The yellow boxes on the gallery will contain images of drawings by the children and photographs
- The home page buttons are the ones attached to the pegs.
- The arrows on the gallery pae!gge will refresh the images in the boxes, not change the page (This will be clarified in the final design).

[Andy] Like the idea of the pegs and the supplied imagery from Piet is seeming well incorporated.. Keep evolving these ideas.. Simple but effective stuff Peter, be a little careful of how the text works on the inner page though - think grids a little more maybe.

Sam

 [Andy] Sam I can't see much more than the very rough layout at the moment - these aren't really of the same nature as the rough mocups I showed in class last session regards the Bickerton site etc. Suggest you revisit those examples [see timetable] and maybe refine this idea a bit more so we can see more of the graphical elements here.. I'll comment again when you've got something more graphical to show..

Simba

[Andy] Heavy use if Piet's imagery Simba.. What I'm not seeing at the moment is those quirky ideas you had regards Shrek characters which I thought had potential too..

Sophie

[Sophie] Here are the basic layouts for my pages. I am going to explore different typefaces to use. Also I need to take the picture for the main navigation which will be created from a picture of the wallpaper in the museum (which I am going to take the picture tomorrow morning). What is your feedback on the design, I am worried it is too formal. I have several other designs i can take further but i preferred this one. 

[Andy] Sophie - really good initial imagery. Love the textured background ideas. Be a little careful though as this sometimes means that the text gets a little lost - a minor issue at this stage but one to bear in mind never the less. Some good early roughs though..

Stephen

[Stephen]

Here are the mock ups you asked for.
These mock ups are subject to change though, as I need to add photos of the museum to make it more attractive, and the colour scheme will also need som work!

[Andy] Some good early visuals Stephen. Like the use of the colour blocks and clear that you've started to think about how your typography might best fit too.. Good consids with the social media links, clear wher the various elements will go and what thye might eventually bee too.. Good.

Alan

[Andy] Like the ref to the sunflower as visual idea - Bees and flowers etc - clear link.. I can see where elements might eventually sit and what they might be too - good. Good thinking with the primary and secondary navigation links too..

Missed deadline but supplied

Rossouw [Wed 30th Nov]

 

[Andy] Good early layout ideas Rossouw.. Clear that you've thought in terms of grids, simple but effective use of supplied Beeline illustrations. Clever use of the 'buzzing around' idea with the bees on the homepage. Good use of simple text hierarchy in the inner page layout.

Heather [Thu 1st Dec]

 [Andy] These roughs show promise.. I like the honey dripping-down idea especially with the checked tablecloth.. the other idea looks less striking though.. There are some minor suggests such as toning-down the intensity of the tablecloth and to put in a consistent main and secondary navigation [as Alan has done] but bar that they show that you've started to think some interesting and appropriate thoughts here..

On the flip side though you've not quite sent them as the spec required as they've arrived to me as quite big photoshop files as opposed to the save for web .jpgs requested..

Some nice potential Heather that you can work up from here - you didn't make the deadline on tuesday [which I'll note for records] but these show potential..

Claire Gee

[Andy] A good start re Photoshop visuals Claire.. The honeycomb idea seems a popular one! I think that you'll need a clear title to back up 'Beeline' too. With luck we can clarify this tues 6th when one or more of the clients come in first thing.. I suspect it will need to read "The Worcester Beeline Storytelling Festival 2012" or similar.. The challenge now will be to start to mimick what we did in session and take these visuals to a DW web page in readiness for the impending peer assessment..

Harriet

[Andy] Simple but effective layouts here Harriet.. This design looks eminently achievable.. You may have a challenge with things like searches but could link to a free search tool like Google or maybe add one in as a javascript option [DW doesn't supply this facility as standard]. The challenge as ever is to try to make clear what will be an image and what multimedia in your final working pages.. Then to crack-on and be building one or more sample pages like we did with the 'Ducky' pages in the last session..

 Irina

[Andy] Good looking early ideas here Irina. A shame they were so late but useful to see never the less.. Simple and effective layout making max use of the yellow and black contrasts. Buttons simple and clear but you might want to use upper and lower text instead of caps as it looks a little formal.. I can see which elements are to be pics and which multimedia which helps too.. UW logo will need to be all white on black though as they won't allow their corp ID to be treated in the way you suggest [very specific how they'll allow usage].. Like the consistent graphical treatment though.. Additionally these were 150dpi [should be 72dpi] and not 800x600px when I checked and CMYK [should be RGB] so I had to resize/rework them to the required spec for the task myself - just so you're aware..