Jump to content

custom avatars and signatures


Recommended Posts


In my Post # 321, I mentioned that I was working on an animated GIF userbar involving a chimpanzee that I put in an oval. The complete details of "ovalizing" the chimp are given in that Post.

The reason I ovalized the chimp is that I wanted to incorporate the BMW auto logo oval in the userbar too. Of course, I made the chimp oval to be the same height as the BMW oval, so that I could scroll both images together vertically. I also made the oval widths the same to "balance" the left and right side images on the userbar.

As a caption for the userbar, I came up with "Chimps Can't Drive BMWs", and the chimp very, very sadly agrees with this assessment, http://i1196.photobucket.com/albums/aa403/larryb123456/Ani_MS_0_14sec_88unique_frames_255colors_350x19p.gif

Ani_MS_0_14sec_88unique_frames_255colors_350x19p.gif

This is a frame-by-frame animation: 88 unique frames, 0.14 sec display time per frame, 255 colors, 350x19px, 266 KB. 8-frame animated GIFs are scrolled vertically -- at a rate of 1 pixel per frame -- on each end of the userbar. The background behind the lettering is a 2-frame animated GIF.

The resource GIF for the chimp was 8-frame and that for the BMW logo was 10-frame. So, I simply deleted 2 frames from the BMW logo GIF in which there was not much difference in the subsequent frames to end up with an 8-frame GIF. This eliminated concerns about coordinating the looping of these 2 sub-animations.

All aspects of vertically scrolling animated GIFs have been covered completely in numerous earlier Posts.

The 2-Frame background animation was made as follows: Frame 1 has a "lattice-type" scanline pattern in which there is a 5px horizontal spacing between both the forward-facing and backward-facing diagonals; Frame 2 is made from Frame 1 by moving Frame 1's scanline pattern 3px to the left. As the 2 Frames alternate from frame to frame in the main animation, the illusion of motion is created.

Andthatsalltherewastoit.gif

---------------------------------------------------------------------------------------------------------

"When you look at "bmw" in a mirror, you see "wmd" (and the mirror-image of your own face, of course)."

larryb123456

---------------------------------------------------------------------------------------------------------

Link to comment
Share on other sites

  • 2 weeks later...

This Post falls in the category of Op Art and to provide some historical perspective, I've given a brief discussion concerning one of the genre's founders, Bridget Riley, at the very end of the Post.

The animated userbar I'm presenting in this Post was based on this Resource GIF, a 15-frame, 480x480px animated GIF with a 0.03 sec display time per frame.

I first resized this GIF, changing the length to 95px to work well with the length of the caption "Op Art Fan" and reducing the height to 65px so that there would not be an overly-large number of frames in the animation. (In essence, I reduced the image size and stretched the image out horizontally.) I also made the right-side scrolled GIF to be the mirror image of the left-side scrolled GIF, to increase visual interest. In addition, I scrolled the left-side GIF upward while the right-side GIF was being scrolled downward, and vice versa.

All aspects of scrolling animated GIFs have been given in numerous previous Posts.

The animation I made is shown below, http://i1196.photobucket.com/albums/aa403/larryb123456/AniMS003sec120frames255colors350x20pxOOED246KB_zps98eaf2ce.gif

AniMS003sec120frames255colors350x20pxOOED246KB_zps98eaf2ce.gif

This is a frame-by-frame animation: 120 frames, 0.03 sec display time per frame, 255 colors, 350x20px, 246 KB. Each letter "pulsation" stays in place for 2 frames before moving on to the next letter, so the display time for each pulsation is 2x(0.03 sec) = 0.06 sec. 15-frame Op Art GIFs are scrolled vertically on each end of the userbar at the rate of 1 pixel per frame.

I kept the display time per frame to be that of the Resource GIF, 0.03 sec, which gives a fairly fast rate for scrolling for a userbar.

Conclusion:

The Resource GIF is interesting in its rotation, but, to me, the image is very stable. My userbar animation is not visually stable due to the coupling of the image rotation with the very fast vertical scrolling and the fact that one can see only 18px in height of the image per frame (i.e., every 0.03 sec). Showing both the mirror-image left and right sides in the userbar and having the left and right side GIFs scroll in opposite directions also contribute to the feeling of vertigo.

To me, the Resource GIF is a merry-go-round, while my animation is a carnival tilt-a-whirl ride. I much prefer the "wild ride".

Andthatsalltherewastoit.gif

---------------------------------------------------------------------------------------------------------

Bridget Riley (1931- ) is an English painter credited with being one of the founders of the Op Art movement in the 1960s. She is probably best known today for the black and white works she created then. These works present straight or wavy lines (occasionally discs or squares instead) in geometrical patterns which give the illusion of movement or changing color. To summarize, Op Art creates optical illusions which make the flat surface of an artwork appear to be highly three dimensional.

I've provided a sample of Riley's most famous artworks, in chronological order, to show the various methods that she used to create 3-D optical illusions:

Movement in Squares, 1961

Blaze 1, 1962

Blaze 4, 1963

Uneasy Centre, 1963

Loss, 1964

Metamorphosis, 1964

Current, 1964

Fragment 3/11, 1965

Arrest 1, 1965

Arrest 2, 1965

Arrest 3, 1965

Of course Riley didn't have the benefits of using computer drawing programs which make the creation of Op Art images very easy. But even by today's standards, in-person-viewing of her Op Art pieces, which oftentimes are very large, is still quite a visual experience.

"An artist's failures are as valuable as his successes...by misjudging one thing he conforms something else, even if at the time he does not know what that something else is."

Bridget Riley

---------------------------------------------------------------------------------------------------------

Edited by larryb123456
Link to comment
Share on other sites

  • 2 weeks later...

In my Post # 353, I presented an animated GIF userbar with rotating Canadian flags. Here's the U.S.A. counterpart, http://i1196.photobucket.com/albums/aa403/larryb123456/AniMSUB009sec96frames255colors350x19pxOOED58KB.gif

AniMSUB009sec96frames255colors350x19pxOOED58KB.gif

This is a frame-by-frame animation: 96 unique frames, 0.09 sec display time per frame, 255 colors, 350x19px, 58 KB. 8-frame U.S. flag animated GIFs are scrolled vertically -- at the rate of 1px per frame -- on each end of the userbar. Letter "pulsations" are made up of white letters with a 2px blue outline.

The Canadian and U.S. userbars are essentially identical in "structure": the flags are the same size; the total number of frames is the same; 22 characters are pulsed twice per loop in each userbar; 8-frame animated flag GIFs are used; and the frames of the left and right side scrolled flag GIFs are not identical for a given vertical position, but they are "offset" or "staggered" in the rotation sequences.

Considering this similarity between the 2 userbars, it's rather surprising to me that the file size of the U.S. userbar (58 KB) is so much less than that of the Canadian userbar (133 KB). Perhaps (?) the more complex background of the Canadian userbar contributes to this fact.

I slowed down the rate of rotation of the U.S. flag compared to that of the Canadian flag -- a little -- so that the U.S. flag blue rectangle with the white stars could be better seen. (The display times per frame for the Canadian and U.S. userbars are 0.07 sec and 0.09 sec, respectively.)

All aspects of scrolling animated GIFs have been covered in numerous earlier Posts.

So................................

Andthatsalltherewastoit.gif

Link to comment
Share on other sites

The animated GIF userbar presented in this Post celebrates

. Since I didn't have any rope handy, I wasn't able to tie a kangaroo down, but I was able to confine a roo (a colloquialism) and its joey (the baby of any marsupial) to a *hopping eternity* of watching letter "pulsations" and Australian flag waving in a userbar, http://i1196.photobucket.com/albums/aa403/larryb123456/AniMSUB012sec96uniqueframes255colors350x19pxOOED137KB-1.gif

AniMSUB012sec96uniqueframes255colors350x19pxOOED137KB-1.gif

This is a frame-by-frame animation: 96 unique frames, 0.12 sec display time per frame, 255 colors, 350x19px, 137 KB. Animated GIFs are scrolled vertically -- at the rate of 2 px per frame -- on each end of the userbar. The waving Australian flag is a 4-frame animation and the kangaroo animation is 8-frame. The background with the moving scanlines is a 2-frame animated GIF.

I thought I'd first discuss my "choreography" so you can better see what I considered important as you watch the animation:

# 1: All letter pulses are done in red, white, and blue, the colors of the Australian flag.

# 2: I never have letter pulsations going on at the same time in "Aussie Strong !" and "Proud to be from Australia" to avoid visual congestion.

# 3: I only pulse "Proud to be from Australia" when the flag completely covers the left end of the userbar to have better structural and color harmony.

# 4: When "Aussie Strong !" disappears in the backward direction, I red-pulse "Australia" in the forward direction for visual balance. For precise visual balance, I stop the red pulsing of "Australia" *exactly* when the "A" in "Aussie Strong !" disappears.

# 5: I was unable to choreograph the kangaroos, since they were too evil-tempered, too uninspired, and too stupid. So, I just had to let them hippity-hop as they saw fit.

I'll next briefly discuss the aspects of making this animation.

The height of the kangaroo scrolling unit is relatively large at 107px.

As discussed in previous Posts, a scrolling unit consists of all the frames of a sub animation aligned and linked so that they move as a unit in the vertical scrolling. At a given vertical position, the appropriate frame is copied and becomes the image for the main animation at that vertical position.

Therefore, I scrolled the unit at 2px per frame so there wouldn't be an overly-large total number of frames in the animation. This resulted in 90 frames for complete up and down scrolling without any pauses at the two vertical transition points (i.e., the positions at which the scrolling unit reverses direction in the vertical travel). Since the total number of frames in the animation has to be an integer multiple of the number of frames in the kangaroo sub animation (i.e., 8), I paused the vertical travel of the scrolling unit for 3 frames at each of the two vertical transition points to bring the total number of frames to 96 [i.e., (90+3+3)=96], thereby satisfying the integer requirement [i.e., (96/8)=12]. In other words, the kangaroo sub animation loops 12 times for 1 loop of the main animation.

The flag scrolling unit is 73px tall, and, with vertical scrolling at 2px per frame, it takes 45 frames for the flag to enter the bottom of the userbar, move across the userbar's interior, and completely exit the top of the userbar. This leaves 51 frames for twice pulsing the letters in "Aussie Strong !", the "backward-direction disappearance" of "Aussie Strong !", and pauses in the "action".

The 2-Frame background animation was made as follows: Frame 1 has forward facing diagonal scanlines with a 5px horizontal spacing; Frame 2 is made from Frame 1 by moving Frame 1's scanline pattern 3px to the left. As the 2 Frames alternate from frame to frame in the main animation, the illusion of motion is created.

Andthatsalltherewastoit.gif

---------------------------------------------------------------------------------------------------------

"It's like trying to pin down a kangaroo on a trampoline."

Sid Waddell

“Don't worry about the world coming to an end today. It is already tomorrow in Australia.”

Charles M. Schulz

"Why did the kangaroo go to the doctor?"

"Because he felt jumpy."

---------------------------------------------------------------------------------------------------------

Link to comment
Share on other sites

The Spanish painter Pablo Picasso (1881-1973) is one of my favorite artists and historical figures and I made 2 animated GIF userbars to honor him.

The first userbar is what I'd call "informational", http://i1196.photobucket.com/albums/aa403/larryb123456/AniMS020sec84frames74unique255colors350x19pxOOED203KB.gif

AniMS020sec84frames74unique255colors350x19pxOOED203KB.gif

This is a frame-by-frame animation: 84 frames (74 unique), 0.20 sec display time per frame, 255 colors, 350x19px, 203 KB. The painting JPEG is scrolled at the rate of 3 pixels per frame, but it's stopped for 6 frames (1.20 sec) each time to better display the title of the painting. The Picasso image is scrolled at the rate of 1 pixel per frame. I had to scroll the painting JPEG, with its title, at a slow rate (i.e., 0.20 sec display time per frame) so that it could be seen clearly. This led to the Picasso image moving in a very slow motion, perhaps too slow. If I had one criticism of this userbar, it would be the slow-moving Picasso image.

In the above userbar, one of Picasso's most famous paintings, Les Demoiselles d'Avignon (1907), is shown (cropped). The actual (uncropped) painting is shown here. This large painting, approximately 8 ft. by 8 ft., is credited with being one of the cornerstones of Modern Art. The work portrays five nude female prostitutes painted in a primitive style. In this painting, Picasso made a radical departure from traditional European painting by abandoning perspective in favor of a flat, two-dimensional picture plane. At the time, the work was considered revolutionary and highly controversial.

The second userbar is what I'd call "straight-forward", http://i1196.photobucket.com/albums/aa403/larryb123456/AniMSUB009sec75uniqueframes255colors350x19pxOOED116KB.gif

AniMSUB009sec75uniqueframes255colors350x19pxOOED116KB.gif

This is a frame-by-frame animation: 75 unique frames, 0.09 sec display time per frame, 255 colors, 350x19px, 116 KB. The Spanish flag is a 5-frame animated GIF. The flag and the Picasso JPEG are each scrolled at the rate of 1 pixel per frame.

In this userbar, I didn't try to achieve as much as I did in the first-presented userbar, and, in this regard, it might be considered more successful. For as Leonardo da Vinci said, "Simplicity is the ultimate form of sophistication." In this userbar, I used a bold pixel font for "Pablo Picasso", and this allowed me to pulse the letters in a very striking, IMO, 2-color fashion.

Andthatsalltherewastoit.gif

---------------------------------------------------------------------------------------------------------

Some Pablo Picasso quotes:

"Action is the foundational key to all success."

"Art washes away from the soul the dust of everyday life."

"It took me four years to paint like Raphael, but a lifetime to paint like a child."

"Art is a lie that makes us realize truth."

"Good artists copy, great artists steal."

And perhaps apropos to this Post (i.e., the second userbar compared to the first):

"Art is the elimination of the unnecessary."

---------------------------------------------------------------------------------------------------------

Link to comment
Share on other sites

The MSFN Rules state that any member clowning around on the site will be banned for life. So,

.........................................................................................

DO NOT CLOWN AROUND !

.........................................................................................

http://i1196.photobucket.com/albums/aa403/larryb123456/AniMSUB012sec100uniqueframes255colors350x19pxOOED138KB.gif

AniMSUB012sec100uniqueframes255colors350x19pxOOED138KB.gif

This is a frame-by-frame animation: 100 unique frames, 0.12 sec display time per frame, 255 colors, 350x19px, 138 KB. 25-frame clown animated GIFs are scrolled vertically -- at the rate of 1 pixel per frame -- on each end of the userbar. "Do Not Clown Around !" has a back-and-forth movement at the rate of 4 pixels per frame and it's in a 20-frame animated GIF.

I've discussed all the aspects of scrolling animated GIFs in numerous previous Posts, but I've never used the back-and-forth movement of text like this before, so I thought I'd discuss the construction of the 20-frame animated GIF which contains the movement. It's really quite simple.

Construction of the 20-frame "Do Not Clown Around !" GIF:

Refer to the diagram below which shows all 20 frames of the GIF, with each frame numbered in red. The red rectangles correspond to to the central portion of the userbar, in between the black rectangles where the clowns are. In frame 1 (and also frame 11), "Do Not Clown Around !" is centered in this central portion, with 20px spacing between the text on each end and the black rectangles where the clowns are. The movement of the text is 4px per frame, so it takes 5 frames moving left from frame 1 (i.e., frames 2, 3, 4, 5, 6) to traverse the 20px and "hit the wall". The rest of the construction of the GIF is based on this same principle of motion, as the diagram shows, http://i1196.photobucket.com/albums/aa403/larryb123456/Constructionof20-frameDoNotClownAroundGIF.jpg The letter pulsations for the word "Clown" are also shown in the diagram.

Constructionof20-frameDoNotClownAroundGIF.jpg

Andthatsalltherewastoit.gif

---------------------------------------------------------------------------------------------------------

“There are two types of people in this world. People who hate clowns...and clowns."

Bobby Pendragon

“I hate clowns. You can't see what they're thinking.”

Geraldine McCaughrean, Peter Pan in Scarlet

As proof of the above quote concerning the fact that you can't always see what clowns are thinking, I've assembled the following collection of images:

Proof 1

Proof 2

Proof 3

Proof 4

Proof 5

Proof 6

Proof 7

Proof 8

Proof 9

Proof 10

x

x

x

Proof InfinitysymbolonMSFNbkg.png

---------------------------------------------------------------------------------------------------------

Edited by larryb123456
Link to comment
Share on other sites

I'm really not a Homer Simpson fan, and, in fact, I don't watch any comedy or variety television shows except for Saturday Night Live. I much prefer MSNBC and an occasional football or basketball game. But I saw a Homer animated GIF and an animated "horizontal bar" I liked, and I wondered what the result would look like if I combined the two in an animated GIF userbar. The result is shown below, http://i1196.photobucket.com/albums/aa403/larryb123456/AniMSUB013sec76uniqueframes255colors350x19pxOOED167KB-1.gif

AniMSUB013sec76uniqueframes255colors350x19pxOOED167KB-1.gif

This is a frame-by-frame animation: 76 unique frames, 0.13 sec display time per frame, 255 colors, 350x19px, 167 KB. 4-frame Homer Simpson animated GIFs are scrolled vertically at the rate of 1 pixel per frame. The background with the back-and-forth motion is a 38-frame animated GIF, and I made it from the "bar" after appropriately re-sizing it. I used: 1) small pixel letters for the text; and 2) 1px spacing between these letters, and these 2 factors allowed the green sweeping background to show through very well. I put the word "Super" in "Homer Simpson Super Fan !" to fill up a little more horizontal space.

All aspects of scrolling animated GIFs have been covered in many previous Posts, and the scrolling here was very straight forward. But I had to "finagle" a bit with Homer's original resource GIF, which was 2-frame, as I'll explain next.

I thought a 0.13 sec display time per frame would allow for reasonably "energetic" letter pulsations and back-and-forth motion of the background. But this display time was much too small for the original 2-frame Homer GIF, as shown below.

Original 2-frame Homer GIF (at 0.13 sec display time per frame), http://i1196.photobucket.com/albums/aa403/larryb123456/Homer_2-frame013secdisplaytimeperframe.gif

Homer_2-frame013secdisplaytimeperframe.gif

Poor Homer looks like he's having a seizure.

So, I made a 4-frame Homer GIF from the 2-frame GIF, very simply, as follows. Denote the 2 frames of the original GIF by A and B. The 4-frame GIF would then have frames A, A, B, B. This is equivalent to frame A and frame B having twice the display time as before, that is 2x(0.13 sec) = 0.26 sec. The 4-frame GIF made in this way is shown below.

Original GIF modified to have 4 frames (at 0.13 sec display time per frame), http://i1196.photobucket.com/albums/aa403/larryb123456/Homer_4-frame013secdisplaytimeperframe.gif

Homer_4-frame013secdisplaytimeperframe.gif

This image corresponds to the image in the userbar shown above.

Andthatsalltherewastoit.gif

---------------------------------------------------------------------------------------------------------

Some Homer Simpson quotes:

"Trying is the first step towards failure."

"Operator! Give me the number for 911!"

"English? Who needs that? I'm never going to England!"

“If at first you don't succeed, give up.”

“If something's hard to do, then it's not worth doing.”

"If something goes wrong, blame the guy who can't speak English."

---------------------------------------------------------------------------------------------------------

Link to comment
Share on other sites

Andthatsalltherewastoit.gif

Can I ask you a favour? :unsure:

Would you make a couple .gif's like the quoted one, one with:

http://www.imsdb.com/scripts/Forrest-Gump.html

...and that's all I have to say about that.

and one with:

http://www.imdb.com/title/tt0114814/quotes

The greatest trick the Devil ever pulled was convincing the world he didn't exist. And like that, poof. He's gone.

jaclaz

Link to comment
Share on other sites

@ jaclaz:

Yes, I'll be happy to fulfill your request(s). I can start on the GIFs in a couple of days.

(I have some other things I'm working on that I need to finish first, else I'll forget where I'm at.)

I have a question about the layout of the Devil text.

Rather than having a long line of text as you show in your quote, do you think it might be more effective to have a more compact layout something like this (easier for the viewer to take in at one glance):

The greatest trick the Devil ever pulled

was convincing the world he didn't exist.

And like that, poof. He's gone.

Also, I think the (vertical) distance between the lines of text in the Posts is too large. Type (i.e., copy and paste) the 3 lines of the Devil text into the MSFN text editor and "Preview Post" to see a better (IMO), more compact, layout. Before I start on the GIF, I'll make a JPEG of the exact layout for your approval. Better to get the bugs out at this point than to have to redo the GIF.

Edited by larryb123456
Link to comment
Share on other sites

@ jaclaz:

I went ahead and made a layout for the Devil text, and I think it worked out well. I corrected the spacing errors between some of the letters and "finagled" a bit to get everything balanced.

In the JPEG below, the background is the color of the MSFN page, so everything blends in. If you want to use the animated GIFs on some of your other forums, I'll need the links so I can get their background colors too. Thus, we'll have a different GIF for each of your different-colored-background forums. This is because animated GIFs do not support partial transparency, which is present when I make the disappearing text with the series of decreasing opacities of the letters. Of course the partial transparency disappears when I merge the partially transparent letters with a background color (as in my disappearing "And that's all there was to it !!!") but you can't have partially transparent letters on a transparent background in an animated GIF. Each pixel has to be either totally transparent (i.e., invisible) or totally opaque.

Well, enough of the mumbo jumbo. Here's my layout. Please let me know if it's OK with you. If it is, I'll go ahead and start on the GIFs. Thanks.

http://i1196.photobucket.com/albums/aa403/larryb123456/DevilText.jpg

DevilText.jpg

Edited by larryb123456
Link to comment
Share on other sites

@ jaclaz:

This is really a continuation of the last Post concerning the GIF problems associated with making text disappear via a sequence of decreasing opacities.

I can make a transparent GIF that you can use on *any of your forums* by 2 ways, and I think they'll be about as interesting to the average viewer as the fading-out disappearing text. That way you won't have to have a different GIF for each different-colored-background forum.

Way # 1: After the Devil text has been seen for a given time, just make it disappear in 1 step (i.e., from 100% opacity to 0% opacity). I've done this a number of times, and it looks OK.

Way # 2: After the Devil text has been seen for a given time, just make it disappear in a *very, very fast* letter-by-letter reverse disappearing scenario like this:

frame 1: jaclaz !!!

frame 2 : jaclaz !!

frame 3 : jaclaz !

frame 4 : jaclaz

frame 5 : jacla

frame 6 : jacl

frame 7 : jac

frame 8 : ja

frame 9 : j

frames 10 -- x : just the background will be seen for a certain number of frames, and then "jaclaz !!!" will type in one letter at a time at the regular speed (i.e., letter frames 9, 8, 7, 6, 5, 4, 3, 2, 1). After it's typed in, it will stay visible for a certain number of frames and then it will disappear by the above *very, very fast* letter-by-letter reverse disappearing scenario. And the GIF loops on and on like this to eternity.

Edited by larryb123456
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...