Client Interview

I forgot to mention that I interviewed my client for approval of the specifications. It was 8 minutes long but I cut all the unimportant stuff out, so it was 7 minutes and I managed to translate it (from cantonese to english) and transcribe it. Here is the transcribed version of the interview. Many things were clarified after the interview and I was able to get a clear picture of what the website will look like. I even sketched out some ideas in my notebook

Unfortunately, due to all the crossing out and italics, my teacher thought it looked too unpresentable and messy, so i have 10 days to fix it and do 2 versions. What i assumed and what i learnt.

Okay the first thing is the audience. I would like to check a few things with you. First, the audience is university students right?

Yes

Are they only undergraduates or do the audience also include those studying the masters degree?

Mostly undergraduates. A few masters students.

A few. Does that mean under 10 students?

Around 5 postgraduates

What would the age range be? Would it be really wide?

Not that wide because undergraduates only study for a few years.

So the age range would be early 20s?

20-25

Not that many elderly right?

Not many

So mostly they all know how to use a computer?

They all know how to use a computer

A lot of the content is from the old site. Would you like to put a lot of emphasis on course lecturer, teaching assistant and contact details?

Not a lot of emphasis is necessary

I have thought about page layouts. Would you like your contact details be in a box on every page?

Only one appearance is necessary, they all know their teacher

There’s also lesson periods, when it is, where it is and this…

The language is English

Yes, this all the old content from the old website. There’s dates…

By dates, do you mean field trip dates or lecture dates?

I mean things like terms, the date of the current day

They need something like lecture dates and field trip dates because they don’t have lectures every week.

Then maybe they need a page with calendar

Yes

Do you need the term written on the website then?

It would be fine if the calendar is there. The term doesn’t really matter. This course only runs on the first term

Would you like to associate yourself with Chinese University and the Department of History? Like have the words somewhere on the website?

Yes

Then the colours…purple and yellow right?

It doesn’t matter

Then I would like to introduce a few new things. Search engines, site maps, comments section on photos. I’m still wondering whether or not to include the comments section

It could be a lot of a hassle management wise

How so?

There could be a lot of criticism on photos. Don’t allow them to comment anonymously

Then about sign ups for an account on the website would you like them to give you their emails to identify them?

I cant trace them if they sign up anyway, it doesn’t matter. But maybe…could I only let certain people in?

Possibly, I could make something that blocks people

But could I give membership could only some people? Could you create a password for all of them?

Yes that could work

And for comments, they have to write their names, otherwise their comments will be deleted

For photo galleries, how many photos do you want in each section? 10-20?

Not more than 20.

Have you got videos?

No

Is there anything else apart from copyrighted images and footage that shouldn’t be there?

No.

Thank you.

Specifications handed in

I handed in my specifications yesterday (several hours late due to a slight misunderstanding).
Also, after 1 week in Australia due to CAS week and another week of hardly doing anything, I am back. During that half term break, I managed to go through 5 more tutorials and I actually started learning new things. A lot of the previous stuff was just the basics which were very similar to other programming languages i have learnt such as C++, basic javascripting and actionscript. This made it very easy for me, however now, i am starting to learn new things. For example, I never knew what typecasting was or what exactly a constant was. I had never come across constants before.

Also, out of personal interest, I am currently researching the possibility of creating multiple pop ups with only one button in javascript. This may help my javascripting.

Lesson 10 and 11-PHP Tutorials and Stage 2

These two lessons, I played around with Notepad++, following through with tutorials. So far I have not learnt anything new from the video tutorials...I'm still on the tutorials for variables. Nothing new yet due to previous experience in web programming and other programming languages such as actionscript and c++.

Oops forgot to mention something.

Whilst listening to the PHP tutorials, i succesfully multi tasked and found some websites to create the PHP and MySQL login system.

I will try these later
http://tutorialzine.com/2009/10/cool-login-system-php-jquery/
http://inpics.net/tutorials/mysql/started27.html
http://www.knowledgesutra.com/discuss/tptpmm-simple-php-login-registration-system.om

Lesson 9-PHP Tutorials and Notepad ++

Today I started watching the PHP tutorials, however I could not view them due to their .mov format on my laptop. Therefore, I had to waste some time shutting down the laptop and turning on the school computer. I skipped the first four chapters, teaching you how to install WAMPP since i already have XAMPP and started on the fifth chapter. So far, it's not too helpful...

Also, I finally came up with a way to organise my codes better. I have currently been using Notepad and I just realized. Notepad++ is a lot better since it tells you for example...which </div> belongs to which <div>. This makes it a lot easier.

Lesson 7, 8-CSS Vertical Text and Backgrounds

These two lessons, I tried to learn how to use vertical text through
http://bytes.com/topic/html-css/answers/513945-vertical-text-using-css-mozilla
http://scottgale.com/blog/css-vertical-text/2010/03/01/
http://snook.ca/archives/html_and_css/css-text-rotation
http://ccapeng.blogspot.com/2008/03/use-css-to-create-vertical-text.html

These sites supported each other and I tried to use the code provided. However, it failed and I decided to simply do it on photoshop at home. I came up with another solution to do so, and this was to use a different web layout instead. So i went to http://www.noupe.com/jquery/45-jquery-navigation-plugins-and-tutorials.html for some inspiration. After examining in depth, the code in
http://net.tutsplus.com/tutorials/javascript-ajax/jquery-os-x-style-dock-and-stack-navigation/
I decided to give it a try myself. I wanted a parchment type background so i decided to use a stock image from
http://www.sxc.hu/photo/1319276
However, it simply tiled instead of stretching. I came up with the theory that if the width and height is set to 100% then it should stretch. However, this was not the solution.
I found solutions
http://webdesign.about.com/od/css3/f/blfaqbgsize.htm
http://stackoverflow.com/questions/1150163/stretch-and-scale-a-css-image-background-with-css-only
but this was a failure since my code was too untidy to put into divs.
Towards the end of the lesson, Mr Dickson gave me as well as the rest of the class a series of PHP and MySQL tutorials. I think Im okay with PHP now, thanks to http://www.w3schools.com/php/ but i still dont understand MySQL

Lesson 6-Proposals and Learning JQuery

This lesson, we handed in our proposals. Unfortunately I forgot to mention to web hosting, but luckily, I still got a green light. In the final proposal, I will have to talk about web hosting and how i plan to try out free webhosts with PHP and MySqL until i find the best one.

After searching up layouts containing JQuery, I was extremely enthusiastic about learning JQuery as it seemed amazing.
http://net.tutsplus.com/tutorials/javascript-ajax/create-a-cool-animated-navigation-with-css-and-jquery/
http://css-tricks.com/695-learning-jquery-fading-menu-replacing-content/

This lesson, i achieved little progress however I managed to learn a lot of JQuery basics from this site
http://www.w3schools.com/jquery/jquery_syntax.asp
This site has good step by step tutorials
For example, i learnt that...
$(selector).action() is basically all JQuery is. $ defines Jquery, selector tells it where I am talking about and action tells me what to do with that section.
The way you tell the selector where you select is...
.something means there is a div named something
"p" means something a p tag
# means id

When i tried these out i found that they did not work. So after googling at home, I discovered that you had to use
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
instead of...
<script type="text/javascript" src="jquery.js"></script>
Also, after going my script again, I found a mysterious Ul and Li tag. Apparently, according to the below website, they suggest a list and bullet points
http://www.w3schools.com/tags/tag_ul.asp