Layout Gallery

All the graphics were designed using an old shareware version of Paint Shop Pro 3.11 that never runs out, a free demo of Paint Shop Pro 7.0, which I've now paid for and own as a registered user, and a pirated copy of Adope Photoshop 6.0. I'm an odd pirate...

Layout#1: Sailor Team Attack!
The first layout
Resolution: 1024x768

I'm really quite proud of the first layout for this site, despite it's many short-comings. I'd never quite been able to dream up a layout for a site beyond the absolute basics of HTML. This layout was composed of several tables, and as I got WPR reviews, I later added CSS effects and DIV aligning, both of which were new to me at the time. This first layout is based on the idea of the Sailor Senshi attacking, or preparing to attack. The top left corner picture changed with each page, and began with Sailor Moon on the index. My original plan was to go through the original five senshi in order down the menu, then Tuxedo Kamen and Chibi Moon. However, when I reached the SOS section, I really wanted the graphic to match the content. Who else could I pick but Uranus and Neptune, who'd been slighted by SOS in the past? So they came between Jupiter and Venus, and bumped Tuxedo Kamen out of the layout entirely.

Layout#2: Codename wa Sailor Moon
The second layout
Resolution: 800x600

This was my first layout catered to 800x600 resolutions and up. I took the extra time to make it look nice in both, so that people on lower resolutions wouldn't be left out. It's also much fancier, incorporating iFrames, tables, and picture centerpiece to define the site layout. When I saw this picture while leafing through the gallery of Artbook I at Manga Style, I knew that I wanted to make it the crux of a site layout. Takeuchi wrote in the liner note for this picture that she drew it before she thought about the content of the story. The idea of Usagi posing with a gun seems rather out of character with the actual series. I played around with many PSP effects in order to make the gun the focus, as I still keep with the idea of the Senshi being upset about the crazy rumors they deal with. This meant a drastic redesign of much of the graphics in the site, but fortunatly, PSP has some great photo editing options to make sure the images still look nice when they've been re-shrunk. It's a decent layout, but I don't like too much now.

Layout#3: Bicycle Built for One
The third layout
Resolution: 800x600

My third layout came about because while coding my Tuxedo Kamen shrine, I conjured up a nice pop-up layout and was hoping to try it out on SMULC as well. Eventually I was just browsing the Inifinity Collection when I found this adorable image of Moon and Venus yelling at each other on a bike. I knew I wanted to make it a layout and figured the black layouts I'd been using on SMULC needed a rest. I had to learn a few more tricks to code it all to fit the layout I had in mind, but after a few frusterating attempts, it all came together. Of course, the brighter colors meant I had to go through all my images again and make them brighter or replace them with different, brighter images entirely.

Layout#4: First Anniversary
The fourth layout
Resolution: 800x600

If you know anything about me and Sailormoon at all, you will know I worship Mako-chan. Thus, putting her up for the first anniversary layout was a given. I broke theme with this one by going away from the fighting theme entirely and showing a happy Mako-chan with a birthday cake. For this layout, I went nutty with the PSP picture tube. The background here is the result of my playing with the picture tube by throwing out streamers and confetti all over the blue background, spraying a white area for the Mako-chan image to go over, and then running a pastel filter over the whole area. It gives it an odd, clip-art look, but I think it really stands out. The balloons were also in the picture tube. I realize it's odd to use blue with Mako-chan, but the original artbook image had a rainbow burst of colors, and I didn't like how the green-themed layouts were turning out. However, the pastel filter turned the white circle green, and this proved appropriate for the place where Mako-chan would sit. Happy birthday, SMULC.

Layout#5: Lights, Camera, Action!
The fifth layout
Resolution: 800x600

It is with this layout that I decided if I just stuck to the theme of fighting senshi, I'd never be able to put together another layout without intensive image searching. Therefore, I decided to use unique, odd, or bizarre images, in order to keep my layouts fresh and themed without just using the same old images EVERYONE uses. This layout, however, was nearly a tribute to YumeMiru reviews, which closed in October, 2003. As I was lucky enough to be a part of this group since April 2003, I wanted to show my appreciation with a dreaming inspired layout. However, as the updates were being further and further delayed, it had been too long for it to be relevant. So my second idea was to move away from manga images (which have been featured in 3 previous layouts) and try either anime or the new live-action show. Finding layout-quality images for either was a challenge, but fortunately, Manga Style had managed to provide one from the October splash page of Sailormoon Channel featuring the Pretty Guardian cast. I was originally going to theme it closer to the Japanese site to show the inspiration, but I couldn't get this idea of vintage Hollywood out of my head. "Lights, Camera, Action!" sounded perfect for the idea of the Sailor Senshi becoming living, breathing actresses.

Layout#6: Plushie Power!
The sixth layout
Resolution: 800x600

By the time this layout came around, I had seen a gigantic jump in traffic from Mozilla based browsers. In particular, Firefox users were now 25% of my traffic. While I'm not the biggest Mozilla fan, by this point I already surfed with Firefox regularly on my laptop because IE would outright crash it. Thus, I broke down and attempted to code to be friendlier to them. This layout was the first one in a long time to use no pop-ups or iframes. The basic code came from a layout on Lycentia's page, but the images and the modifications to the various parts of code were all mine. The idea for using a plush was rather sudden, from a desire to build a layout from something incredibly original. I simply took my own UFO doll, laid it on a bed of white sheets, and took some pictures with my digital camera. The resulting digital image made her look almost like a Powerpuff Girl, so naturally next came Jupiter-themed explosions with the doll and the roll-over text popping out of them. PSP7 actually had outlines for a variety of explosions, which made designing the layout go much smoother. I broke a lot of my previous habits with this layout, but I like how the image portion came out and I like that despite Mozilla's best efforts, I was able to come up with a truly user-friendly layout that was still appealing to the eyes.

Back