Mockups

homepageMockup

 

Note: I just wanted to spend a little bit of time talking about why my homepage mock-up is so different to my end result. Obviously there are traces of similarities from my mockups to my end result but realistically I had no idea what I was getting myself into with Bootstrap.  I feel like I quite easily could have made this if we were not using bootstrap but it wouldn’t have been responsive. Saying this, I am still proud of what I made, but I would have been a lot happier if it had of looked closer to this – If I had of had more time, and put more research into this assignment early on I probably would have been able to tackle this quite easily. The problem was I aimed to high, and then realised I wasn’t really too sure on what my capabilities were and what the limitations of bootstrap are.  The remaining mock ups are basically me giving in and realising that in order for this to all make sense I needed to just jump into some code. If I was to do the assignment again now with the knowledge I have it would go a lot differently I feel.

contactMock

 

I apologise for the state of my final few mockups, I just had little to no idea how I was supposed to design for bootstrap so I basically made basic wireframes. Even after research I just didn’t understand designing for bootstrap. I really needed to look at more bootstrap websites but I just didn’t know where to look.

 

applyMockup

 

campusMockup

 

startingMockup

 

 

communitiesMockup

 

 

Sources

Proposal

 Text Version: 

 

1.0 Opening Statement: The client, Auckland University of Technology, approached the ‘team’ seeking a functioning concept redesign of their website. Before the client makes any decisions on the final website design, the team has been asked to redesign the content of 6 pages of the clients current website located here: http://www.aut.ac.nz/

2.0 Statement of Communication Objectives: The project at hand is a complete rebranding of Auckland University of Technologies (AUT) current promotional webpage. This webpage is primarily used by undergraduates and students returning to study as well as those already studying. Therefore, users are looking for a whole experience of a website encapsulating AUTs forward thinking appeal to it’s target audience of undergraduates and as above. The team intends to redesign the following 6 pages:

1. Homepage (http://www.aut.ac.nz/)
2. Study at AUT (http://www.aut.ac.nz/study-at-aut)
3. Being a Student (http://www.aut.ac.nz/being-a-student)
4. About AUT (http://www.aut.ac.nz/about-aut)
5. AUT study guides (http://www.aut.ac.nz/study-at-aut/2015-study-guides)
6. Contact us (http://www.aut.ac.nz/about-aut/Phone-numbers,-contacts-and-campuses)

3.0 Treatment: The current site no longer fills AUTs requirements for branding themselves as a forward thinking top tertiary education provider within New Zealand. With the introduction of it’s new building WG, AUT feels as if their attention should be turned toward their online presence and the way they present themselves to undergraduates and the general public. How the team intends to work with these ideas is to capitalise on icons, grid layout and a minimal palette of colours that appeal to their audience, while still remaining professional. The current website is made in a single column fashion (sometimes dual column). The team feel as if this makes the page seem a lot more sparse. The team believe infinite scroll is a good idea, but intend to limit the scroll, utilising the whole webpage with grid layouts with little scroll. This however may change per webpage as pages such as ‘Auckland University of Technology Study Guides, (http://www.aut.ac.nz/study-at-aut/2015-study-guides) offer a lot of links on one page that need to be displayed in a very specific way. The team plan to make the website a lot more compact than it currently is, while keeping with a consistent design across all webpages. The team also intend for the webpage to move far away from it’s current design and towards something a bit more stylised, and more targeted towards their audience of undergraduates aged 17-24 (primarily female).

3.1 Layout: AUT’s current website layout (as left) is very tight an compact. Our layout treatment proposes we space this layout out and create a more fluid website, enabling a responsive flow for their new website design. This resposivness makes it easier for AUTs website to be accessed on devices such as smartphones and tablets and doesn’t limit their audience. With this in mind, we are aware that AUTs primary user base for their website is people who already go to the university, and the university supplies students with computers that the website will be viewed on. Thats why we aim to take the primary viewer base away from ‘current students’ and move it more towards ‘prospective students’. With 2015 applications to enroll quickly approaching this could not come at any better time.We plan to do this by playing more attention to the layout and placing things on the home page and other pages based on what prospective students want to see.

3.2 Colour: Although a colour scheme is still being worked on at this stage – we can agree that AUTs current colour scheme doesn’t work to well. It is very dark and needs uplifting. AUT’s new website will focus on lighter colours and a more brighter scheme, featuring light tones of orange and blue with a lot of images.

3.3 Logo/Rebranding: AUT has also approached us for a new logo. This will prove challenging as we will need to create something that is versatile – a brand that can be printed on paper in black, and be viewed on a screen in full colour. AUTs current logo is very basic, and works on a very basic level. However if we we’re to create something more eye-catching that could be used in various ways AUT would be open to trying it out if it appeals to them. The following images are logos we are putting forward to AUT for logo rebranding:

166163

94064603.4 Logo/Rebranding Cont: We feel as if this logo works well as it can be used in mutiple ways – as well as on the website we intend to build. It fits in well and could be used to showcase AUTs work on screens, on paper  or on any for of multi-media. As far as the website goes, the black or white verison of the logo as left will be used predominantly to advertise AUTs new brand just in time for 2015 enrolments.

4.0 Components (refer to Sources below): From AUT we require access to their images and text accross their website. Whatever is missing will be filled with ‘placeholder images’ and ‘lorem ipsum’.

5.0 Budget: The project will be completed ‘pro bono’, or free of charge. Any expenses incurred though production are to be paid by the team and/or negotiated with the client. However, the team reserve the following rights: The team reserve the rights to the designs and work produced. This means that if Auckland University of Technology decide not to go with the team, they must relinquish all drafts, concept work and finalised designs so that they may not use them in the future. The team also reserve the right to be accredited to the work. The team may place their logo at a size no greater than 200px x 50px on the webpage to promote themselves as the creators of the design of the website, not the content.

 

Sources Retrieved from Client (Auckland University of Technology)

AUT WG photos retrieved from:
http://www.aut.ac.nz/about-aut/Phone-numbers,-contacts-and-campuses/sir-paul-reeves-building

AUT Millenium campus photos retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/aut-millennium-campus

AUT North Shore Campus photos retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/north-shore-campus

AUT South Campus photos retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/south-campus

Map of City campus retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/city-campus

Map of South campus retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/south-campus

Map of North Shore campus retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/north-shore-campus

Information about Applying to AUT retrieved from: http://www.aut.ac.nz/study-at-aut/apply-to-aut

Information about Communities at AUT retrieved from:
http://www.aut.ac.nz/community

Information about AUT campuses retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/city-campus
http://www.aut.ac.nz/study-at-aut/campuses/north-shore-campus
http://www.aut.ac.nz/study-at-aut/campuses/millenium-campus
http://www.aut.ac.nz/study-at-aut/campuses/south-campus

Information about Bachelor of Art and Design retrieved from:
http://www.aut.ac.nz/study-at-aut/campuses/south-campus/undergraduate-study/art-and-design/bachelor-of-design

Information about Starting out at AUT retrieved from:
http://www.aut.ac.nz/being-a-student/starting-out

Video for Starting out at AUT retrieved from:

http://www.aut.ac.nz/being-a-student/starting-out

Video for Orientation at AUT retrieved from: http://www.aut.ac.nz/being-a-student/starting-out

 

Proposal Drafting

Proposal_WIP_01

Text Version

ProposalHeader

Opening Statement: The client, Auckland University of Technology, approached the ‘team’ seeking a functioning concept redesign of their website. Before the client makes any decisions on the final website design, the team has been asked to redesign the content of 6 pages of the clients current website located here: http://www.aut.ac.nz/

Statement of Communication Objectives: The project at hand is a complete rebranding of Auckland University of Technologies (AUT) current promotional webpage. This webpage is primarily used by undergraduates and students returning to study as well as those already studying. Therefore, users are looking for a whole experience of a website encapsulating AUTs forward thinking appeal to it’s target audience of undergraduates and as above. The team intends to redesign the following 6 pages:

1. Homepage (http://www.aut.ac.nz/)
2. Study at AUT (http://www.aut.ac.nz/study-at-aut)
3. Being a Student (http://www.aut.ac.nz/being-a-student)
4. About AUT (http://www.aut.ac.nz/about-aut)
5. AUT study guides (http://www.aut.ac.nz/study-at-aut/2015-study-guides)
6. Contact us (http://www.aut.ac.nz/about-aut/Phone-numbers,-contacts-and-campuses)

The team has picked the following pages as they believe that these pages provide the most ground to prove their expertise in both design and functionality. Users will be looking for a […]

Treatment:

The current site no longer fills AUTs requirements for branding themselves as a forward thinking top tertiary education provider within New Zealand. With the introduction of it’s new building WG, AUT feels as if their attention should be turned toward their online presence and the way they present themselves to undergraduates and the general public. How the team intends to work with these ideas is to capitalise on icons, grid layout and a minimal palette of colours that appeal to their audience, while still remaining professional. The current website is made in a single column fashion (sometimes dual column). The team feel as if this makes the page seem a lot more sparse. The team believe infinite scroll is a good idea, but intend to limit the scroll, utilising the whole webpage with grid layouts with little scroll. This however may change per webpage as pages such as ‘Auckland University of Technology Study Guides, (http://www.aut.ac.nz/study-at-aut/2015-study-guides) offer a lot of links on one page that need to be displayed in a very specific way.

The team plan to make the website a lot more compact than it currently is, while keeping with a consistent design across all webpages. The team also intend for the webpage to move far away from it’s current design and towards something a bit more stylised, and more targeted towards their audience of undergraduates aged 17-24 (primarily female).

 

Layout:

 

CurrentLayoutAUT

 

Wireframe_01

Logo:

aut_logo

 

LogosWordpress

 

WatermarkedLogo

Colour:

Components:

Budget: The project will be completed ‘pro bono’, or free of charge. Any expenses incurred though production are to be paid by the team and/or negotiated with the client. However, the team reserve the following rights:

The team reserve the rights to the designs and work produced. This means that if Auckland University of Technology decide not to go with the team, they must relinquish all drafts, concept work and finalised designs so that they may not use them in the future.

The team also reserve the right to be accredited to the work. The team may place their logo at a size no greater than 200px x 50px on the webpage to promote themselves as the creators of the design of the website, not the content.

Time: TBC

Questions I still need to answer

 

  1. What will users want from this site and how will you provide this?
  2. How will you brand and theme the site and what is your intended communication for this?