Tuesday, November 29, 2005

Interactive Web Form Page

This week's assignment was different than the previous ones. My webpage 9 does not have so many graphic elements as all other pages created before, and is designed to collect evaluation feedback for my final project.

Before creating my web usability form I wanted to decide for myself, how it can be useful and what potential result of getting the response can be. My final project is about students' trip to Russia, St.-Petersburg this simmer 2006. It will be organized by the Department of Geography and Planning as a whole class equivalent 6 credits. I am very happy and proud of our University to give such a wonderful opportunity to the students. The trip will have both educational and entertainment purposes. It is always interesting to visit new places and learn something new for yourself. My web form will serve the purposes of both finding the weak and strong parts of my web site as well as getting students opinion and recommendations about the trip. Of course, in such situations you can always contact your professor for all the necessary information. But I find this kind of form to be useful too. For example, in some cases professor is not available or it is just easier for a student to fill this form and give his opinion/reccomendations than contacting someone through email.

Perl module appeared difficult for me to study. Even though we did not have to write it from the beginning, I got some errors in submitting the form and had to fix the code.

Forms are becoming more and more popular on the Web now. I am sure you have seen those endless pop-up windows, asking you to answer this or that question. Some of these forms are really short, having just several questions. Others are more complicated. I think anyone in his life has had to fill these forms online. The examples are numerous. Do you remember yourself searching for a book in the library catalog online and submitting your order? Our
Interlibrary loan uses these forms. You can find a book from the WorldCat catalog and ask for the lending libraries to send it to you. Another example is taxation. Instead of filling the various number of papers (which are complicated to fill by a person without good instructions), you can go online and complete the taxation forms. This will save your time a lot! One more example is our ITS services. Once I had a chance to request software to install on my computer. So, I filled the required form and submitted it to the service. It saved my time a lot and I got a response in less than one day! One can name a lot of examples of using the interactive web forms. Companies use them to get the valuable opinion of their customers. The answers can be used to improve the productivity of the companies according to people's needs.

Nowadays more people prefer to fill the forms online instead of filling endless paperwork. You can create your web form in such a way that it can even check for user's input spelling mistakes, etc. The implementations of the forms online are really useful and have a great future!

Tuesday, November 15, 2005

Fireworks, Auto Shapes and More Cool Things

This week we were continuing working with Macromedia Fireworks MX 2004. The program gives you a lot of freedom to express your ideas. The more I work with it the more I find it to be user friendly and more intuitive than Flash, for example.

The program allows you to create various types of shapes. There are several auto shapes in Fireworks. As it is mentioned in the Help, "Auto Shapes are intelligent vector object groups that adhere to specialized rules to simplify the creation and editing of common visual elements". And it is really true. For me it is difficult to draw anything from scratch with a mouse. That is why I found these auto shapes useful in creating vector objects. I tried all of the auto shape forms. After creating a vector object you can select it and small yellow points appear around the object. They give you a lot of control in changing the shape of your object. And if you are creative, you can get new type of objects rather than drawing them from scratch. I tried changing the star, oval and arrow objects and this is what my final results were:

fireworks1

For my
web page 8 I used the techniques shown by our small Web Team 4 - creating buttons and pop-up menus and editing text properties. As I mentioned in my previous blog posting, I wanted to try creating buttons in Fireworks. We had some experience with buttons in Adobe Photoshop, Macromedia (roll-over effects) and Flash. Fireworks allows you to control and change your button's properties very easily. You can apply a lot of effects to them. If you want to create a button in Fireworks you do basically the same operations as in Flash. To create a button from scratch you choose Edit>Insert>New symbol and choose button type. Or you can simply convert any object into button by choosing Modify>Symbol>Convert to Symbol. It is the same as in Flash; and it is very easy to apply or change over, down and other frames in Fireworks. This all worked well for me. You can add different fill modes to your buttons so they have some shadow and even 3D effect (for example, by choosing gradient fill options and adding inner bevel effect to a button):

fireworks2

In my
web page 8 I used several text effects. For the title I used the effect of transperent text - so you can see the image "through" the text itself. I typed the text and then copied it and made it bigger. Using the magic tool I selected all the letters, saved bitmap selection and pasted it on the other text (restored bitmap selection). The result was that I was able to see through the text and see the underlying layer (image).

I created a draft page for my final project. The idea was to create a banner or a logo. But I have to work on it more. I also placed three buttons - and one button has pop-up menu with three links. The links do not work yet and have to be updated.

I am excited that we are learning Fireworks program. I like all the programs we have learned in this class. I think they are all useful in designing web pages.

I noticed a very interesting fact. After learning Macromedia programs I began to pay more attention to the design of the web pages. My mind now works in a different way - I am not only enjoying the cool stuff on the web but also analysing it, thinking how the pages were created, for example, if they were created in Macromedia Flash I check this by right clicking to any interesting commercial or small animation I see.

Tuesday, November 08, 2005

Fireworks Page

Macromedia Fireworks is a new kind of program for me. I did not know anything about it until last week. I had no idea how many exciting features it has and how much accessibility it can add to your web pages. I was just at the beginning level last week and discovered many interesting things for myself in this program so far.

I am really excited that we are using this powerful tool for designing web pages. I really enjoy working and exploring the program. Although, you should not forget that this program is just a kind of graphics software (but what a powerful one!) and should be used with Dreamweaver. Actually, what you do is creating your page in Fireworks the way you like and then exporting it to Dreamweaver to fix the code and add additional features if necessary.

Fireworks program is similar to Adobe Photoshop in the way it allows you to create graphics. But Fireworks is more advanced software in the way it has more web design oriented tools. We all have a lot of experience with Macromedia Flash and creating animations. Fireworks allows you to export your animations as gif or Flash swf files. At the same time, you can create animated graphics in Fireworks itself too, for example, "moving" text or objects. So, as we see, Fireworks work with other applications. You can export the files created in Fireworks into Macromedia applications, Adobe Photoshop, Adobe Illustrator and others.

Last week in class we were working individually and in small groups to learn Fireworks. I liked our last class. I was reading Professor Mackey's tutorials about creating files in Fireworks, and did quite a good job. I successfully finished all the tutorials except the validation step.

For my
Webpage #7 I created a mock-up landing page for my digital portfolio. I used web slices and roll-overs for the links to my web pages created during the semester. I remember myself struggling with Flash, creating buttons and trying to find a way of showing images using the buttons (Webpage #6). The problem was that after pointing to the large picture, where the "over" frame of the button was, the image appeared (this happened because the "over" frame had two images - the button itself and the enlarged picture). Last week I could not find any solution to my problem. And I was really suprised when I discovered that Fireworks allows you to create
a roll-over effect that replaces your image with another one in a different location on the same page when you point over the mouse. That what I wanted to create in Flash and finally found a good answer to my question in Fireworks. I took the same idea for my digital portfolio.

While working on this page I discovered a lot of new tools in Fireworks.
I found the toolbar on the left to be quite similar to the one in Photoshop. I tried to draw different vector objects and apply special effects to them. I discovered that it is very easy to draw any kind of objects starting from simple arrows to very complicated spirals. And the variety of techniques to improve you drawing is really great! For example, you can apply different styles for the borders by choosing Air Brush/Textured and then choosing any kind of texture you like. This technique will help you to get marvellous table frames. I also worked with the text, and found a lot of interesting effects which you can apply to your text. The graphics in Fireworks can be interactive. You add slices and hotspots to your objects and you get rollover functions. I think, this program is less complicated than the other Macromedia programs we have worked with. And it is definitely less complicated than Adobe Photoshop.

My next step in learning this program will be learning how to create button symbols and drop-down menus. I also want to try creating animation in Fireworks. I found Fireworks to be very intuitive to work with. Although I do not think it is more visually-oriented than other programs we have learned. That is why I was reading the tutorial that comes with Fireworks installation "Using Fireworks MX" to get some support. I found the tutorial to be very informative. I will be reading this tutorial to get some help while working in Fireworks. I would recommend this tutorial to anyone who has just started learning Fireworks. Besides, do you know that Macromedia site has Fireworks support Forums? One of them is
Fireworks General Discussion Forum . There you can find the answers to different types of questions asked by the users or you can post your own question to get some support information.