Finalexampresentation

12

description

The final exam project presentation. Fingers crossed.

Transcript of Finalexampresentation

Page 1: Finalexampresentation
Page 2: Finalexampresentation

Introduction

After one year of studying multimedia design and communication we were faced with a project that would contain all the knowledge we gathered this year and that will stimulate us to create a complete and fully functional product for a possible client.

The project task was to take an existing company and improve the existing platform with a new website and several other digital products.

What did we do?

We started by asking a question, the problem formulation phase.

Page 3: Finalexampresentation

Problem Formulation

We used the normative problem formulation (How) to try and solve the problem in the project. Our problem formulation is: "How do we communicate effectively the Full Circle Fuels company’s services and their CSR actions to the general public and raise market shares ?" Context: The Full Circle Fuels ( http://www.fullcirclefuels.com ) is a small US based company that is converting diesel engines to vegetable oil engines. Their products are eco-friendly and they need a new website, they need to engage in CSR and promote them on their website and so on. This is the company we chose for our project.

Page 4: Finalexampresentation

“Measure twice and cut once”

This was our first goal in this project. We had to start to build the product based on a plan that would ensure the success of the project. Project management was important from this early stage of the prototype.

We started brainstorming for ideas on how to improve the product of our client. First, we saw all the flows in the design area and in the marketing strategy and continued with creating a project plan for our needs. From PBS to WBS was just a step and so we created the whole project plan using a waterfall approach combined with prototyping (this way we managed to set milestones that would let us now how the project is going)

Page 5: Finalexampresentation

Design and Development

Being that the task was mainly to redesign the website of a company we had to focus on improving the current website. The main goal at this point was to create a usable and visually attractive product. We started doing layouts and brainstorming on the best way to display our content and structure our site. We learned a lot from reading about usability on different web genres sites and we followed laws on design (Gestalt laws).

Page 6: Finalexampresentation

After the layout took shape we assigned different tasks to work on visual elements, visual identity for the company, print material and of course coding.

Visual identity

We decided to change the current visual identity of the company and rebrand it in a new different way that would attract more awareness and more clients.

Old identity Our first tryouts

Page 7: Finalexampresentation

The website

The website was designed and created using Adobe Photoshop, Illustrator, Dreamweaver, Notepad++ and tested on the major browsers. The code is validated by the W3 Standards and the code is commented for other future developers to help them.

We used HTML, CSS, Javascript, XML (for the sitemap) and PHP (for the contact form) to code the entire website in a clean visually attractive product. All the bits of code or images used were accompanied by a non-commercial GPL License allowing modifications and use of the resources.

Page 8: Finalexampresentation

http://stud167.webkn.dk/fcf

Page 9: Finalexampresentation

Other materials

We planned an Adwords campaign, online internet marketing via publishing websites and outdoor advertising to attract new clients.

Page 10: Finalexampresentation

User Testing

We conducted user test with the prototype and we used the feedback from the users to modify the website and make it more usable. Also we identified a couple of bugs and fixed them before delivering the final product.

The users were 2 boys (both international and danish) and 2 girls (the same, international and danish) taking into account their computer skills and different factors.

To ensure they feel comfortable we offered them cookies and beverages and we started every test with a small discussion to interact with them.

After presenting the project and the prototype we started with some basic questions about the website that focused on navigation, design, information etc. We gave small tasks to the users to see how would they use the site at first glance and also to get insight on any problems the users would be facing.

Page 11: Finalexampresentation

Cookies with feedback

We gathered all the data from the users and after examining every video of every user test we began improving some area of the website based on their feedback. Surprisingly we didn’t have to modify by areas of the site due to the initial wireframe we built.

We discovered some small bugs on links that were not well defined and we altered the speed of the slider for the users.

Page 12: Finalexampresentation

Vlad Gidea http://stud167.webkn.dk/html [email protected]

Tak / Thanks