My Themes

by Jean Gosselin

What's in a Theme?

For me it's all about the 'Story'. A site must deliver this story upon access through a theme's metaphor and symbolism. We have reached an era where web users expect visual and interactive functionality requiring some form of customization over generic plain website templates. In the movies, concept art is used for creating the "look and feel" of the film. Such creative ideas communicate with us on a gut level. A theme concept alone does not make a website any more than an ant farm is a city. And the site concept isn't just about layout, graphics and multimedia any more than an auto-parts store is a car. For these concept devices to provide more than just a beautiful webpage, a solid Web Software Framework is required, and this is where ocPortal's CMS plays a crucial role interconnecting these building blocks for the development of dynamic websites.

Installing ocPortal is actually very easy if your server is configured correctly. It provides an instant and total website solution right out of the box; no third party modules are necessary, translating into a very stable environment allowing users and designers to concentrate immediately on customization. Combine this with an impeccable support from ocProducts and I find myself creating more and more 'stories' through my website designs to communicate on a common ground a specific visual experience that may be just the connection that both the site owner and the visitors are seeking.

icon
You can view the Site HERE

The purpose of this theme is to serve as demo to my "Tutorial: A Gaming Community Theme (Part 1) ", which have now both been upgraded and updated to the latest version of ocPortal 5.0.3. I've also reduced the Flash Header size by 2/3 and offered a transparent substitute Header for those not wanting to deploy flash on their website.

The Tutorial is to show how easy it is to transform the default fluid design theme with a fixed-width design and add a dramatic Flash Header, an image background and a bit of style. In just a few simple steps, anyone can give a very different look to their website.
 



Click on the above image to visit the demo site.
This is the Demo Theme used in my Tutorial: A Gaming Community Theme (Part 2) updated for ocPortal version 5.1 beta1
More modifications added to (Part 1) to create an exciting theme, including framing the flash movie, adding texture and changing icons. I've also introduced test code in HEADER.tpl to detect the Safari browser in order to replace the Flash movies with Fixed Images for anyone not using Adobe Flash Player.

This theme has been made and tested to work best with the Firefox browser.
At this moment, it is beyond the scope of my involvement with theming to attempt cross-browsers portability.

Cool Faces

Click on the picture for Demo Site

This theme serves as an example of integration with the new Facebook social graph Platform. It is already coded with a set of APIs and tools which enable you to integrate with the social graph to drive registration, personalization, and traffic to your website. It provides a simple view to visitors and members on your site, and the connections between them like friendships, likes, and other tags. This theme goes a bit outside the normal ocPortal variable width design with two side panels. My design provides for a right side panel only, but with a slightly larger width and does away with many of the standard boxes borders.

The forest theme image
Click on Image for DEMO site
(This is part-1 of a wide panoramic two parts 'Nature' Theme to be installed as the 'Site Zone' main theme.)

I've used one of my digital painting compositions as a splash screen in an ocPortal website theme to showcase a feature allowing for distinct "welcome" and "site" pages. I've created two themes: One for the "welcome/splash" page, which acts as the canvas for my panoramic painting, and the other more traditional for the "site" itself.

So, here it is; an imaginary scene, deep inside a dark forest.
The full scene is "1920 x 1200"

I wanted it overtly dark so that falling leafs and other elements touched by sun light would stand out in rich tones amid dense and misty undergrowth.

Africa Theme Image

You can look at the Demo here: Africa

It is "All Systems Go" for South Africa's FIFA World Cup as plans are finalized ahead of the June 11, 2010 kick off. This website theme template offers a sense of the spirit of a unique land with many rich cultures and ancient civilizations. I've lived on its West coast and visited several places on that large continent more than 30 years ago, and yet it's magic and sense of wonder never left me.

 

Family Theme Image

You can look at the Demo here: Family

Modern families have both, immediate and wider family members living abroad or far from their original place of birth. This kind of site can act as a useful meeting place for all and enable collaborative interaction to trace their history together.

 

Edge Theme Image

You can look at the Demo here: Edge

Edge is a theme for ocPortal inspired by the forthcoming AdobeŽ Edge web motion and interaction design tool that will allow designers to bring animated content to websites, using web standards like HTML5, JavaScript, and CSS3. The use of HTML5/CSS3 box-shadow techniques to highlight a set of golden steel plates forms the basis of this theme. I have tried once again to demonstrate that it is possible to dramatically transform the look of the off-the-box ocPortal CMS with very minor changes to the glogal.css file and without modification to the templates. This theme and its header animation should be completely compatible with the latest browsers such as I.E.9, Firefox5, Chrome13, Safari5 and most new browsers supporting HTML5+CSS3 and the png graphic format. One interesting observation I made is that even the Admin Zone looks smashingly good Through the lenses of this theme. Try it you'll see what I mean!

 

BF3 Theme Image

You can look at the Demo here: BF3

IT'S ZERO DARK THIRTY for the Dogs of War
The Dogs of War

By force of habit I'm up and about like a barrack rat and ready to blow my bugle even if we are between wars. You can still find some of us roaming the firing ranges and practice grounds, waiting to re-up to proudly wear the tree up and tree down again. We are like John Wayne's toilet paper--rough, tough, and take no *shit* from nobody. Some of us may have pop smoke and left for a few days, but it's probably because we generally do not like to just hurry up and wait for the--war tourists--to get off the battlefields. Well, maybe we're just weekend warriors but we've been waiting patiently for war game producers to get off their fourth-point-of-contact and stop exhibiting cranial-recti syndrome while giving in to a trigger happy crowd of console warmongers requiring a quick fix of uber-explosions with astonishing amounts of gore and vehicular, architectural, and airborne carnage. The moment has finally come with EA Games deciding it's time to deliver a meaningful wargamer's world where strategy is not just fire-for-effect. Battlefield 3 is going to have the war simulation, largely absent from other war shooters, absolutely covered. Jets, tanks, jeeps, helicopters, with over 20 vehicles in 12 classes. BF3's vehicle customization component is much bigger, deeper, and more tactical in nature than in previous Battlefield games. So, lock and load, soldier! There's a war going to happen shortly and you will be dropped into the middle of it. Use this bleeding edge of Web Technology to set your staging area. Recruit your friends, sign-up and join us on the Battle Server. Meanwhile, you'll find me at the mess hall at Zero Beer Thirty, blowing steam with other dogs of war and wearing my helmet with the chinstrap unfastened.
LandRover a.k.a. Jean

 

Back to the top