Sunday, October 26, 2008

Lesson 9 Advanced Topics (Continued)

Pandora Internet Radio: This project is part of the Music Genome Project. How music is composed is a mystery to me. I have no background in music and no idea how it works. The terminology is foreign to me. To read about the music genome project, then, is just as mysterious. This projects assembles musical qualities into a "genome."
The project examines attributes of the music, referred to as "genes," such as harmony, vocals, rhythm, instrumentation, etc. and matches similar types of music. For example, I chose a song by Bjork, and then the project brought up a song with similar qualities by a different artist. You can create up to 100 stations based on various artists, songs, or musical attributes.

I think that the concept is really cool. However, I guess when I decide I like a musician, I just want to hear that person. I don't necessarily want to hear other music like that person. I don't know why. But, I do think it is quite amazing that this sort of thing can be done.

I am not going to look at other web editors and text editors at this time. I am still struggling with how to use the one I have now. Because our book suggests using separate external style sheets, I am trying to build by pages step-by-step, using HTML. I want to learn how that works. Our MacDonald text warns against getting tangled up with the WYSIWYG editors. I want to be able to keep a handle on future changes.

I am also struggling with the fact that I have never learned Photoshop or a drawing program before. This is just too much new material to learn. I am just going to have to do the best that I can at this point with my text and some very simple graphics.

Wednesday, October 22, 2008

Lesson 9: Advanced Topics

Scripts are short pieces of code that add certain functions to your site. You can actually cut and paste a piece out and put it into your own.

In order to put an MP3 (compressed music file) on your site, you need to make a .M3U file in notepad.

Websites: FlashVista is a flash directory with flash resources and tutorials. I've been looking at some examples and the one that I like best is Thibaud's portfolio. He has all these little cards like color swatches, and when you hit on one, they all fan out. Then you can zoom in for a closer look. It's subtle. That's the only kind of flash I like. I am now on MONO*craft and fascination is competing with annoyance. I like the backgrounds, but the way everything starts flying by the screen when you put the mouse on it is driving me crazy. I feel like I'm playing a video game.

Flash Tutorials: The one that I wouldn't mind learning to do when I get beyond the basics is how to make the camera focus change effect in flash. Looking through the tutorials makes me think I have to get back to the basics first.

Site Pal Avatar: No thank you. I don't know why, but I find these fake cartoon people really annoying. Interesting to see how it's done, though.

HotSripts.com: a directory that compiles Web-programming information and resources. There are lots of scripts you can click on. This is all new to me. If you click on JavaScript, for example, you will see a clickable list of books, references, scripts and programs, software, tips and tutorials, and websites. Again, something to revisit when I get beyond truly understanding our text. Right now I'm combing through Chapter 7 again.

Basic Info about MP3's: MP3 is a technique for compressing audio files. The systems for doing this are called codecs. Earlier codecs were for real-time playing; MP3's were for downloading. Apple's iTunes offers AAC. ACC proved better than MP3 in testing.

How to create M3U files and streaming audio: I did not know this: When you are listening to streaming audio, you're listening to something as it's downloading. Streaming allows visitors to listen quickly. When not streamed, it takes longer and the person ends up with a copy of the audio item on their computer. To set up streaming audio, set up a text file that contains the link pointing to the MP3 you want to stream. Then save the file with an m3u extension.

Audacity: Free, open-source software for creating and editing sounds. You can use it to record live audio, convert tapes and records into digital recordings, edit various sound files, cut, copy and splice . . . There's a book that explains it, too! (I wish there was a book for GIMP. Reading the manual and flipping back and forth between screens is not cutting it for me.)

Musicovery Internet Radio: I'm trying to figure out how to select things. I see the "mood" box, and I'm cruising around there, but I wonder if there's a way to do a search for a particular artist. It doesn't look like there is. Also, I keep getting the message that my selection is too tiny. I don't know what that means or how to get out of it. I am kind of having fun seeing what I come up with by chance.

Sunday, October 19, 2008

What I did yesterday

Below is the culmination of all my days off from work trying to figure this stuff out. (Of course, I couldn't include my background, my picture, or the groove border I used.) I think now that I spent too much time on GIMP for too little return. I made a valiant effort, but I must stop putting my energy into it. I must go back to HTML. This time I will start over with my real website. Below was just practice.


I am building a web site at the speed shifting tectonic plates. I mean I am going slow. I mean I am doing it piece by piece. I mean I have tried doing bits and pieces at least fifty times and I get tangled up and confused every time. This has been a truly humbling experience. I tried to find a picture of tectonic plates on stock.xchng, but there wasn't one there. I'll have to say that building this site is happening as slowly as your toenails grow.

My book is telling me that using inline images is the simplest way to arrange pictures. I'm going to add a bit of code to make the picture float left.

Mmmmm. . . . I love plain vanilla.


So, my action plan has changed. I have decided that instead of devoting my website to something I am doing at work, I am going to devote it to the trials of learning to make a website. This subject may be better suited to a blog, but all things considered, this is the best thing to do. There is too much newness, learning, and stress connected to my job and too much of the same in this class to lump the two together. Not doable.

So, keep going . . . .

Lord, Help Me

In class, we are now on Chapters 15 and 16. In terms of what I'm now understanding and learning, I'm back on Chapter 7. It is so very discouraging. I have had the last few days off from work, and I've spent hours just trying to find tutorials to the most basic parts of GIMP. Paths, Dialogs. . . I don't get it yet. But, I have to start somewhere, so I will forge ahead.

I am not by any means ready to put into practice the techniques in Chapters 15 and 16. In the case of Chapter 16, I don't care as much because I personally hate things that move and jump around on websites. Cannot stand them.

Chapter 15 address issues that I will eventually incorporate, providing I catch up. It is about fancy buttons and menus. A few basics:

Dynamic buttons, also called rollover buttons, change subtly when a mouse hovers over them. Some dynamic buttons have three pictures: one for the initial state, one for the hover state, and one after the button's been clicked.

It is important that buttons are lined up, the same size, and consistent throughout. To accomplish this, go to www.buttongerator.com

Reminder: anti-aliasing is a feature that smooths the edges of a font by blending them with background.

Be careful when naming buttons so that you don't get tangled. Use a descriptive name, followed by an underscore, followed by the button state (normal or mouseover).

To keep things simple, make a picture list. Use a JavaScript element called an array. Create two arrays, one for the normal images, one for selected buttons

MacDonald also suggests preloading images so that buttons are as responsive as possible.

There is a section describing the alternative way of setting all this up in Dreamweaver or Front Page. I don't know yet if KompoZer has anything Komperable.

For now, in order to save myself, I MUST go back to chapter 7.

Thursday, October 16, 2008

Lesson 8: Imagery

I am such a technophobe. This is how much: My husband has had Adobe Photoshop 3.0 for what seems like years, and I’ve never touched it. I am going to look at the tutorials for the first time.

Notes: Gimp: Open source software to edit and retouch photos and images. Photoshop Elements is Photoshop Lite, according to the first turtorial on YouTube. I just downloaded gimp in case I get overwhelmed by Photoshop.

The first tutorial went down very easily. I edited one of my pictures and compressed it enough to email. What I learned:

1. For brightness/contrast: go to colors

2. To sharpen: go to filters, enhance, sharpen

3. To compress, go to scale, image, percent. Make sure locked. Bring down to about 20% (451?)

4. When asks quality, choose around 70%. Lower means smaller file, but too small may lead to degredation.

The Joy of Painting with Gimp tutorial has no sound and is about 10 times to fast to follow. Waste of time.

Oh my God! I just spent so much time searching for an understandable tutorial for Gimp. Good Lord! If I ever learn how to do this, it will be my mission to make a tutorial that is understandable, i.e. visible, audible, and at the right speed. What’s the point of doing the tutorial at the speed of light? If I could process that fast, I wouldn’t be doing the tutorial.

I finally found one the right speed. I bookmarked it. To distill:

1. Scaling (I think this is like compressing) click scale tool, drag handles, or lock to keep proportional.

2. Cropping: Pick exacto knife icon. Click inside area when done.

3.Cutting with transparency. Get paths tool. Pick stuff you want. Shift V, Conrol I, Delete.

Chooe PNG format for images with transparency.

Part 2 of the tutorial shows how to make a button in Adobe Flex. ? I’m not that advanced yet.

I’ve been perusing a number of tutorials for Gimp on YouTube, and so many of them are talking about “dialog”. I don’t see that anywhere on mine, so that must be something old.

I’ll go on to the other websites for this week and see if they help.

Let’s try the Gimp User Manual: I don’t know why I have the tools screen but not the image screen. I’ll have to put an email out to the class. I have spent all day doing this. Gotta stop!

Friday, October 10, 2008

Chapter 5: Beaird

Imagery:

Things to remember: Is it relevant? Is it interesting? Is it appealing? I have to be careful that I answer these questions correctly with my imagery. If I take a picture of a bunch of teens hanging around Teen Lounge or playing games, how will I make that look intriguing? The backdrop of the library meeting room isn't that exciting. Hmm . . . I really want to use images of the actual library and people because using flashy, even slightly stylish images, would look like I was trying too hard. That is just NOT our library. Anything that looks commercial would look fake.

Maybe not for this project, but for future reference: get free stock photography from Stock.XCHG
I doubt I will ever be purchasing images in any form, royalty free or not.

Google Ganking: getting an image off a search and then manipulating them to fit your needs. Don't do it. Assume images are copyrighted. If an image is marked as free, let the creator know how you are going to use it.

Hotlinking is another no-no. That's when a site links to files on the designers' own servers.

Creative cropping. I don't often compliment myself in this course, but I have to say I do have an eye for composition. That is probably the ONLY time I will feel confident in this course. Maybe not, though. I could have a breakthrough.

I have GOT to look at my video tutorial on Photoshop. This is something that my husband has played with, but I haven't.

Thursday, October 9, 2008

Typography Websites (Continued)

Microsoft Typography: Reading about TrueType. It looks like that's what is on my screen right now. It's a digital technology developed by Apple, but now used on both Apple and Microsoft platforms. The TrueType rasterizer is the program that reads the font description and generates the bitmaps.

Micorsoft ClearType: Technological innovation that improves screen readability.
The TrueType rasterizer is the program that reads the font description and generates the bitmaps.

This site doesn't do much for me. It's getting into detail that is beyond me at this point.
But, I'm looking to download some of the free fonts. I don't even know how to install a font. I need a tutor. What I really need is to have taken a basic "How to use a computer" class before this. This little things are big stumbling blocks simply because I don't have the basic knowledge.

ABC Typography (virtual museum). I'm a little confused by this site. I'm trying to look at the classical typefaces, but every link is dead. Okay, I was able to open the 20th century, and at least read about Albertus, Eras, and Rockwell. The links on the drop-down menu are dead. Same is true of the modern collection. Interesting to find that some fonts were designed, at least in part, to compensate for the difficulties of reading from a screen and laser printing. Lucinda Bright is an example, d.o.b 1991.

A List Apart: