The New Recipes Section!

After a few weeks after the Ymedia Challenge finished Jayne from Diabetes New Zealand emailed us to tell us that the new recipes section has been uploaded to the Diabetes New Zealand website. Here are some shots of the new section.

What we've been doing

Still waiting for contact from Diabetes NZ to see what Squizz is doing with getting our stuff live.
We'll be in contact with Jayne and Squizz to get everything sorted.

Video De-Brief

Final Report

Final Report

What our team have done:

When our tutor Klaus told us about the Ymedia challenge we had no idea what he was on about. He told us to attend a meeting and find out what the competition was all about. So we went on our lunch break as we were told we would get yummy food for lunch. It turned out to be really interesting too, we met Pamela and Nathan, they told us what the challenge was all about. We found out it was a competition where teams work along side a community group to help them improve their website or to help them with a technology problem they had.

Back in class we, Shannon, Mikey and Elena, decided to come together as group for this challenge. We then looked at the community groups that have already joined the challenge. We chose our two favourites which were Diabetes NZ and Pablos Art Studio. We submitted our entry to the competition with our favoured community groups. About a week later we found out we’d been selected for the competition which was awesome.

From there we we’re given our community group which was our first choice, Diabetes NZ. We contacted Jayne Cooper-Woodhouse, the Communications Manager of Diabetes NZ and set up a meeting to get to know the organisation and for her to get to know us a little. We found out what the organisation does, who they serve, etc.

Later that same day we had a Ymedia workshop to make our brief for the challenge. This is what we came up with:

Team name: The ultimate chocolate fish

The organisation: Diabetes NZ

Mission/vision of org: To enhance the quality of life of people with diabetes.

Identified goal of project: Provide clear navigation from the Diabetes NZ website to the recipes section and make recipes section more of a prominent feature.

Current barriers: difficult and complicated content management system. Gathering all of the recipes needed may be difficult to compile. By developing the recipes section in HTML the pages can later be integrated into the website.

Typical client: Anyone who has Diabetes and is interested in finding out great recipes that they are able to eat. Also family members or friends cooking for someone with Diabetes. These people will likely be caregivers or parents, young and older adults who are able to cook for themselves or someone else. The recipes must be accessible and visually compelling to these people.

Possible design solutions: drop down menus for easy navigation, feature recipes to grab the attention of those looking for recipes, glossy images. Some sort of button or link to the recipes page. Search–able recipes. Flash animations to draw the eye of the target audience.

Evaluation of solutions: Drop down menus and a feature recipe on home page will be effective for allowing easy navigation and for providing information quickly about feature recipes. With our knowledge of HTML and Dreamweaver we will be able to create these things. With the time we have and our teams skills flash animation will not be practical for us.

Proposed solution: A prominent shortcut or button to recipes from the current Diabetes NZ website homepage, feature recipes on homepage, two drop down menus to choose recipe, recipes pop up in new HTML page for easy indexing for search engines. Easy navigation within the recipes section of the site.

Focus of solution: to make recipes a bigger feature on their website, easier to access from home page and easier to navigate around. Also to make the recipes section look good with a suitable contemporary style.

Design approach: required elements - recipes, images of food, featured recipe to advertise a special recipe. Look and feel - contemporary, strong and fresh and glossy to appeal to the adult/parents/caregivers/elderly cooks cooking for people with diabetes or themselves.

Scope of work: Jayne - copyright clearance, getting style CSS sheets to us, sending us recipes and images. Us -Research recipes layouts on existing food and recipe websites. Find out ways to make sure Jayne can use what we do to add more recipes to the site without help.

Outscope of work: Clearance, integrating the new HTML recipe pages to existing website. (A web company called Squizz that Diabetes NZ already works with will help with integrating the work we do).

Technology to be used: Fireworks, Dreamweaver, HTML, CSS, internet (obviously).

Timeline: Jayne sends us recipes, style sheets and images by 30th latest. Start working on research/concepts on 28th. Working out how to do drop down boxes and javascript. Give Jayne our first concept by 1st August and check in with her again on 6th for any final changes that need to be made.

We then started doing some research on existing recipe websites and books, and other websites in general and different ways they had ordered lists/drop down menus. We also researched HTML codes of features we wanted to include in our pages like a drop down menu.

We made up some design concepts in InDesign that fitted with their existing site and their company colours. We started playing around in Dreamweaver and Firefox to start to get a feel for the programs as we had only done basic HTML code in class before. We set up a meeting with Jayne on Tuesday 5th to show her our concepts and work we had done so far. She really liked our concepts.

Jayne liked this concept but instead of a list style navigation to find the recipes she wanted a drop down menu in the right column with a list of the recipes. This was an easier way to sort them and an easier way for us to make the links work. Having the recipes in one simple list also makes it easier for users with Diabetes to be able to click the links as they sometimes have trouble keeping the mouse steady. We sorted the recipes into categories with the healthiest options at the top, and the baking and desserts at the bottom.

We also decided to have blue as a background colour to the titles as this was a more contrasting colour which makes it easier for users with Diabetes to see.

Another feature Jayne wanted to have was a button on the homepage that advertised the recipe feature of the website. She wanted people to easily see and access the section as this is one of the most important elements of the site. So we created a prominent hexagon-shaped (as it is part of their branding as well) button, which when clicked, will instantly lead to the main recipe page where the drop-down menu is located as well as the “Recipe of the Week” section. To make the recipes more noticeable and interesting, the team had to create a new look for the recipe pages. We changed their standard white background with all the listings on the left and the picture on the right to a grey bordered, light grey background which will make it stand out from the rest of the elements of the page. We had the main title above with the image at the left below the title and the ingredients on the right. Below them is the description of the recipe and some additional things to consider and some references. We decided to put the image on the right, below the title to make the picture more noticeable (that they would notice it first) and the recipe more enticing. Borders were placed within the table to add organization and reduce the risk of confusion with the text. Since their existing recipe website has nothing on the right side, we decided to put the drop down menu there to make the space useful and also a bit more strategic since the existing outline navigation of the site is on the right. Adding a drop down menu bar will give the customers and members easy access from one recipe to another.

During the development phase, the team has learned and accomplished heaps, creating a working drop-down menu bar, a clickable home page button which leads to the recipe page and a new look and design for the inside recipe pages using tables and columns using Adobe
Dreamweaver, Firefox, Firebug and the internet browsers Firefox and Internet Explorer.

We set up a meeting with Squizz, the web management company who was going to help us integrate our work to the Diabetes NZ website to make it live, for 10am on Friday 8th. Jayne accompanied us too. A member of Squizz showed us how their content management program, Matrix, worked and how to edit the code for the recipes to replace it with our codes. So we started doing this on two of their computers, to save time. We spent a few hours editing and intergrating our html code into the matrix system the way Squizz showed us. After working on this we started working on the drop down menu too. We had to fix all the links so they were in the Matrix setup. Once we had done this it should have been easy from there since all the links were working, but when we copied the dropdown menu to our recipe page it didn’t appear where we wanted it to, it was down the bottom of the page. One of the others from the Squizz team figured out it was doing this because some of the recipe titles in the list were really long, making the drop down menu wider than the right column. He said to fix this they would need to redo the CSS style sheet to change the width of the right column, and then have to change the width of the header, effectively having to change the whole design, which would take a few hours. By this stage we had already been there working on the code for just over 4 hours.

Eventually we came to the conclusion that we weren’t going to have time to do this before the challenge deadline. So we saved the work we had done, and Jayne asked them to restore the Diabetes NZ back to how it originally was for now, to maintain a professional website.
To get our work live we need to edit the CSS style sheet with Squizz because of the complicated nature of the CSS. Jayne has contacted Squizz regarding where we go from here and requested they get back to her by Tuesday. Well be in contact with Jayne to find out the next steps towards getting our work live.

References:
Squizz
Klaus Kremer
Anthea Whittle
http://www.entheosweb.com/fireworks/default.asp

Scope of work

Here is the scope of the work we planned to make work. We sent this to Squizz so that they would know exactly how we want the website to work when they help us integrate our web pages into the existing web site.

Second to last day

It's the second to last day, the challenge ends at 6pm tomorrow.

Today we've been working on more html stuff. We got all the links finished today so all the pages we've made now link. From the homepage you can click our button which takes you to the recipe page. Our jump menu works too, when the user clicks on the recipe it will take them to the recipe itself.

We have 3 main things left to do now.
1. We're trying to make the jump menu on the right column of the web page fit in to the column properly, at the moment it's hanging out way too far to the right. We're not having much luck with it as we can't work out how to change the width of it.

2. We need to make a button that is next to the recipe of the week which will take you to the full recipe.

3. We need to make a container in the recipe pages that will align everything.