Project 2 Requirements - Due May 27th

Project 2 is all about understanding your role as a Web Design consultant. You can imagine that you are working as a consultant for The Ocean Project (theoceanproject.org) who has hired you to create a new design for their website as they feel their current design is getting a little stale after two successful years of presentation. The current site is completely based on three templates which were provided by a Design Firm after six months of interviewing, discussing, and iterating upon a design with The Ocean Project staff. The staff gives you the three templates:

template 1
template 2
template 3

and the Cascading Style Sheet that is used to capture the consistent design elements across templates and within content within each page:

style sheet

As a consultant, you create a project on your computer with which to try out ideas for new designs. You spend the time to understand the current templates and discover all the components that are contained in the design (since the client tells you they are all still desired in the new design). You look around within the current site to see how the templates have been used from the last design. You search the Web looking at other ocean and environmental themed sites to get a sense of what you think works and does not work for the conservation awareness industry.

You grab some examples from exisiting sites and get familiar with the designs so that you can take the best from each to influence your own creative design process. You make some designs and try out adding representative site content within pages based on your templates. You iterate and refine your templates based on what works and what does not work. As you think you are making progress, you upload your templates and pages based on those designs to your course directory folder located within /var/www/html/risd/htmlcss directory on the www.oworld. org server (feel free to make a project 2 folder to keep your new project separate from your first assignment results).

Your requirement is to create three new templates with your design and show demonstrations of how your templates work with existing pages within The Ocean Project site. Pick three pages that demonstrate your design best. Send me an e-mail message with a URL to your directory within the www.oworld.org/risd/htmlcss site where you have uploaded your solution or else send me your files as attachments to an e-mail message (if you send me attachments, I will put the files up on the server myself so it would be better if you did it to continue to practice your FTP skills).

The project is due May 27th. Please do discuss it with your classmates as you see fit. Here is a dialog with the first submitter that I had that can demonstrate what I consider a proper submission (if you disagree and have a better idea, submit as you see fit):

Hey Nancy,

Thanks so much for submitting! Now I have a good example of what I would prefer the submission process to be. Take a look at:

http://www.oworld.org/risd/htmlcss/nlk/Project2/

I created a project page (index.html) in your Project2 folder that provides your overall thoughts and submission. The minimal requirements are already there (I did it to reward you for submitting first!). Note that the first three links show off your templates (nice work), but I then added three links to show off the *use* of the templates with the current content.

That work was pretty straightforward, but did teach me some stuff (which is why I wanted you to do it - you should get the lessons instead of me). You'll see how the background image for your Template2 won't work too well for current content (it is too cluttered for readers, I think, but you can contest my opinion and put it back of course). And, also note how your second template expanded too far to the right when I dropped the current content in. That means one of two things, I think:

1. You need to adjust your template to better handle the current content.

- or -

2. We will need to modify our content to implement your design (it is always harder to tell the client that - so be sure you can justify it if necessary).

I will use your submission as help for others to know how to submit ideally. Look for the Forum post on that soon! You have at least an A- in the class (and an A unless your peers really deliver something a notch above). So, you don't have to do much more unless you want for me. Do more for yourself though, of course!

As for the issues you suggested here...

> Okay I have uploaded several times with DW and it seems like it went thru

It did. But your local directory structure is not the same as the directory structure you are intending to load up on the server. I found all your files up on the server, but they were in strange places within the nlk folder. So, check your local folder structure within Dreamweaver if you want to redo it to match what is on the server. I usually just move my local stuff to a temporary place and grab the site from scratch again (so that the folder structure is guaranteed to be identical since you are downloading it from the server). Then, you can start updating the pages again.

> I want to overwrite but when I go to our class's oworld location only Project 1 > is showing and the last modified date hasn't changed.

Yes. And I think you overwrote part of your Project 1 submission accidentally? Can you reload your Project 1 pieces once you get the project 2 issues working within Dreamweaver.

> I am going to attach the files to this and subsequent emails so that they get in ontime.

Of course you can do that all you want. But, you probably want to learn from your errors too, right?

> And whenever you get spare time can you please try and let me know why its not working.

You created the proper folders (img and css) but you save the content that was supposed to go in there to the parent directory (probably by dragging them into the root project folder instead of into the subfolders?). You need to make sure the folder structure in your site manager looks the same as how you want it to look on the server - Dreamweaver will force it to be so.

> Can we alter the css once we put in the "real" content?

You can, but it must remain changed for the templates as well. You use the real examples to fine tune the templates and make sure they will work for all the existing content before submitting to the client.

> I do have one question though: how do you get the real content that gets brought in to the template for showing.

I just grab the source from the page source view in the browser - so, the PHP directives have already been processed at that point.

> It displays weird because I don't have css titles that the original css had?

You mean the class and id attribute values? You can take a look at the content and adjust your css appropriately, if you want. The class and id attribute values are seen clearly in the code once you grab the source from the browser view.

> Does the php have tags in it?

Yes. But you don't have to worry about that. The PHP is already processed before the page is shown in the browser (it gets processed by the server before send to the client).

> I used the original sizes except on one of them so I am wondering if > the php effects this or has tags that I am missing css for in my css.

Great. See if you can track it down. That's part of your assignment. But, note again, the PHP is already processed once you view the HTML code within a browser window.

> I am not clear on how we put the real content into our templates. I > thought only of cut and pasting from real site to template as this is only > method I know at the moment or did you cover this in a video and I missed it?

Drats. I thought we covered that in week 2. That you can steal any code from any page in the browser by looking at the source in your Web browser (View-Page Source in some browsers from the main menu - equivalents in others). Did you think it was different for our project somehow? The trick is universal for HTML code, whether static or generated through a dynamic process like PHP, JSP, Servlet, ASP, etc. - since server side dynamic code still arrives as a static page in the browser.

> Feel free to post these questions on the forum if you think it will help others.

Sure. Thanks for that.

> I would love a one on one meeting to go over my project and clear up > lingering issues if possible.

Awesome. How about next Monday? I am available all day if you have a time and place to suggest (something on the bus line like downtown near RISD would be preferred).

Think about this all a bit before you respond.