Friday, October 28, 2005

Why Blogging? Deja-vu...or Flash Techniques

Blogging is popular... Do you know that there is an official blog search? Try Google Blog search, where you can search for your favourite blog topics. Try typing "Flash tutorials" and you will be amazed by the number of people who share their thoughts and opinion about Flash.

This week we were writing our comments to other students in class. It was interesting to see what other students think about Flash, I discovered that it was not only me who spent hours and hours to figure out what my mistakes are and how to create a good web page. All the blogs and web pages created by students look really great. I wrote a response to Lawrence's blog where he provided some links to Flash tutorials.

For my
Web Page #6 I wanted to use buttons and menu techniques. I also wanted to create something that I can show later to my family and friends as an example of my work created in Information Science Class. As s result I decided to create a small photo album.

I discovered that in Flash you can use several scenes with different frames in them. This is something like several windows, you navigate to them by clicking their names in a scene panel. Buttons will be helpful there to navigate from one scene to another. The main page has pull-down menu, with links to 2 other pages, Albany and Boston pictures. I wanted to create three scences, but I failed at this part. It seems to me that pull-down menu is a movie clip and when creating a link to another scene from this menu it does not see it. That is why I created two different web pages, each for SUNY and Boston. The album is small with only six pictures. It is only for demonstration results. I applied some motion tweening to the main page. After posting everything and looking at the final result I discovered that my pictures (or buttons in Flash) do not work as they are supposed to work. When you point you mouse to any picture a bigger preview appears on the right. But... when you just point your mouse to this empty area on the right some photo comes up. I did not want to get this result. This is the negative moment in creating a button, I think. I could not find any solution to this problem. The "over" frame has this bigger image and it is shown every time you point your mouse to it.

My conclusion here, Flash is a program which can surprise you at the moments when you do not expect any problems to appear. You have to have a good understanding of what you are trying to do and what result you expect.

Tuesday, October 25, 2005

Flash Page

Web has a lot of amazing things. When you go online, you can see plenty of pop-up windows, banners and animations. I was interested in the question of the origin of all these things. How are they created? Do you have to be a proficient artist or an experienced programmer to be able to draw all this fancy stuff? Some of the animations are really nice.

I started learning about Flash MX2004 one month ago. Our team group is having a presentation about Flash this week. So, I have been reading the
Macromedia tutorials. I tried to complete some of the lessons but I found them to be a little bit complicated; and it took me much time to study them. I found that learning the Flash's effects is much more difficult than learning Photoshop, for example. It took me hours to follow all the steps in the tutorials. But after getting the correct result I was excited. I could not believe that I created these animations by myself. I actually enjoy using Flash. The tools in the toolbar are similar to those of the Photoshop. Flash gives you an opportunity to create anything from scratch by drawing, cutting, pasting, transforming, scaling and using all other creative tools. I like using Color Mixer. It is a special design panel for creating solid, radial, linear and bitmap fillings of the shapes. And then you can use Fill transform Tool to change the direction of your filling. You can create really interesting fillings by using these tools. You can also import images in the Flash Library and use them on your Stage.

In class we were introduced to some general techniques such as shape and motion tweenings. You can also add timeline effects to an object by right clicking on it and choosing Effects (Blur, Drop shadow, Expand and Explode) or Transform/Transition. I used Transform and Explode effects for creating my Flash animation for Web Page 5 assignment. The idea was to create a working animation which will be used as a banner for my Digital Portfolio. I tried to use the basic and more advanced effects in Flash. I drew some simple objects and added motion tweening to them. Then I placed text with motion and shape tweenings. You can edit your text almost the same as in Word by using text properties and choosing text font, size, et cetera. And it is really great.

I found Flash to be a powerful program. If you know how to use it, you have a wonderful chance to create an interesting animation and make your site look better. Flash is a great tool to bring easy interaction to your sites. And I like the fact that Flash creates vector based images and video. The resolution of them can be really high. And the size of your animation is not so big. My small banner for Digital Portfolio is only 35 Kb.

Tuesday, October 18, 2005

Census Data

For this assignment I decided to create a table with Census information from the American Community Survey website. I was very surprised by the fact that such kind of Survey was done every 10 years before. Now American Community Survey will improve the situation, providing economic, social, demographic, and housing information to the communities every year, instead of once in 10 years.

From the site I learned much interesting information about collecting the data for the Census. Data can be collected by mail (self-enumeration through mail-out/mail-back), telephone (computer Assisted Telephone Interviewing (CATI) and by personal visits (Computer Assisted Personal Interviewing (CAPI).

Knowledge of the results of the ACS can help to solve different problems and needs of the population. I study at the Department of Geography and Planning. Though I am a geography major, I am also interested in planning courses. And I know that such kind of information from the Census is very important for planners. Planners can estimate demographic, economic, social and housing characteristics. If you know, for example, which areas are extremely rural and which are not so populated, you can better plan medical facilities, educational institutions and so on. Accurate knowledge of these characteristics helps planners making decisions on development that is suitable for future residents. It helps in economic development, for business decision making. It can be used by government as well - knowledge of standard level of leaving can help to plan the budget properly (pensions, insurance and welfare payments, cash benefits). These problems are really difficult to solve without results of ACS (53 population variables, and 42 housing variables).

ACS provides local communities with more up-to-date and accurate data to help them better plan to address the needs of their citizens.

I found a lot of useful information on the ACS website. As an example I created a table which shows some general facts for three counties.
I did not like the navigation on this site. After reading Page Design tutorial from the Yale Web Style Guide I can say that this web site was not created according all the requirements to make it easy to explore and read. It took me some time to find the necessary information. I think that this site lacks visual hierarchy and logic. That is the main problem of many modern sites. They have good information inside and very complicated navigation. So, you should always think about your readers while creating a good web site.

Monday, October 10, 2005

Imagemaps and Rollovers

What is an Imagemap? According to Wikipedia, "in HTML an image map is list of coordinates relating to a specific image, created in order to hyperlink areas of the image to various destinations". An imagemap can be very useful in many ways. It gives you an opportunity of creating multiple live link areas of an image. You do not need to divide the image into several parts.

For the third assignment Web page #3 I wanted to create an imagemap with the links to additional information. I chose a place in Saint-Petersburg that is very popular among the citizens and the tourists - the Peter and Paul Fortress. Located in the center of the city it is a great historical place. It is actually the oldest construction in the city. Inside the fortress there are a lot of places to discover. That is why I wanted to create a map of the fortress using an imagemap technique so that the user can get more information about any location by clicking a number on a map. While searching for the good map I was really surprised that our University Library has a lot of material about Saint-Petersburg. I found several maps, chose one with a best quality and scanned it. After that I had to apply several effects and filters to my map in Photoshop because the map had a stripe in the middle (the map takes two pages in the book and as a result has a white zone in the middle after scanning). This took me a lot of time to get a map a more or less presentable view. I applied the artistic filter of posted edges, so the map's details could look sharper.

I read the chapters about HTML and graphics and Page design from the Yale Web Style Guide. Creating a page layout can be a really difficult and long process. It is very important to create a good and efficient layout for displaying the information. Web Style Guide gives you many useful advices about this. I tried to develop an overall layout of my page using a conceptual drawing on paper. I had several ideas but the best one was to put the image on the top of the page (so that when the users open my page they see a map of the fortress) and all other information underneath the image. I used the table to create the layout. The table has two columns and two rows. The left column is narrow and has some additional information and links to the places inside the fortress, while the right column contains the main text and is wider. This layout helps to make the information accessible and easy to read.


I had some images of the places inside the fortress taken last summer such as,
St. Peter's Gate, Cathedral of St. Peter and St. Paul , Neva Gate, Trubetskoi Bastion and Monument to Peter the Great.

I decided to make the links to these pictures from my web page. By clicking on a number on the map another page will open with the more detailed image and some additional information about the place.

Macromedia Dreamweaver is a great tool for creating complicated layouts. I used CSS to add additional properties to my text and table as well as other tags.

For the link to my blog I decided to use the roll-over images. In Photoshop I created a polygon and applied a gradient background (using gradient tool) to get an interesting combination of colors. For adding the 3D effect to the button I used the Single Column/Row Marquee tool for selecting the edges. After changing the brightness/contrast of the edges the button looks more highlighted.
Button2
Button1

References:
1. Leningrad: A Guide. Moscow: Raduga Publishers. 1984.
2. Leningrade and Its Environs A Guide. Y.Doroshinskaya, V. Kruchina-Bogdanov, Moscow: Progress Publishers, 1979.
3. Masha Nordbye St.-Petersburg. Russia's Imperial City. Passport Books in conjunction with the Guidebook Company Ltd., 1983