Monday, April 30, 2007

log on

Consider this scenario: You need to build a login so that users can leave comments on your web site.

The processes that need to be implemented would include:

  • Logging in
  • Creating new accounts
  • Sending lost passwords
  • Editing account information
How would you design this 'web application' and represent it as a flowchart?

Image: 'climbing'
by: Ard Hesselink

Saturday, April 21, 2007

design or die

hi folks,
I haven't forgotten you (I've just been ignoring you all :-)

I'm a bit worried about how much emphasis I've been putting onto the nuts-and-bolts side of the web development process. For the face to face students that's fine - you've got other teachers to take you through the tools, design and documentation elements; but for the online folks, there's been a bit of a gap in your official education.

So, it's time to change all that. To kick off, lets start looking into design elements.

I just came across a pretty reasonable article where 35 designers were each asked 5 questions about their design practice. Result: 175 professional suggestions, tips and ideas from some of the best web-developers all around the world. This has got to be better than anything I can cook up. Check it out at SmashingMagazine

Another area I've been worried about is the planning and contract side of the webdev biz.

Now, I know you're all over podcasting, since I gave you a link to the excellent Ask a Ninja explanation, and... good news, Boagworld have just finished covering client contracts in nitty, real-world detail over several podcasts (starting in week 64). Check it out at the Boagworld podcast archive

Hope you're all fired up with enthusiasm, this should be an interesting few weeks...

Wednesday, April 04, 2007

forming up

This week we'll played with some nifty form elements. The W3C have the definitive word on forms here, or you can find a gentler introduction on Tizag.

Once you've gotten across it all, try to implement a simple form. See if you can re-create the following useful web page:

To get it looking just like this, you'll need a couple of divs, one floated to the left, or you might want to see how the pros do it on the create forms using CSS page.

Once you have the form all built, set its "action" attribute to point to

Try it out with both GET and POST methods.

That should be enough to get you through the Easter break, see you all in a couple of weeks and don't eat too much chocolate.

spread your programming wings and fly

If the JavaScripting hints in the last programming post were too obscure, here's a link to an exercise with a little more meat to it - it includes all the script tag, prompt and alert messages you could possibly want to complete the first week's exercises for 'sequence'.

To follow up, we'll be looking at how to represent 'selection' in pseudocode and flowcharts. There are some paper exercises in this little document - try them out and then see if you can implement exercise 2 and 3 in JavaScript. You might find JavaScript Basics Part 2 useful. As usual, upload your solutions and add a blog entry about your trials and tribulations.

Original image: 'Transparent dove'
by: Vince

it's podcasting, Jimmy

all about podcasting

Sunday, April 01, 2007

Programming can be fun

Just so you don't turn out like the poor ex-student shown here, I've uploaded a couple of 'ease-into-programming' worksheets.

Try out the first few:

When you get to the exercises at the end of each, try to implement your designs using JavaScript. To do this you will need to know a little about setting up a script section, creating variables, getting input from the user, and writing output to the web browser.

Have fun, and please... if you find yourself waving the keyboard around and screaming, take a break and think about just how stupid the average computer really is.

Original image: 'Programming'
by: Jean-Philippe Daigle