Mar
29
2010
2

AffectiveDesign.com Launches Today!

Today marks the launch of AffectiveDesign.com, a project I’ve been working on for Design and UX Expert, Trevor van Gorp. The design and flow of the site was created by Trevor; the HTMLification and integration into WordPress being my task. WordPress has come a long way from its early days as a simple blogging platform. Previously it required a lot of hacking to get it to behave like a Content Management System (CMS) but thanks to Pages and a bit of theme code, it actually works quite well for light-duty websites. 

The theme I created for AD implements some interesting WordPress-as-a-CMS functionality. While plug-ins play an important role, I tried to implement the bulk of it using WordPress theme templates. WordPress supports distinction between “Posts” and “Pages” (and sub-pages) which I used extensively to organize page data. Top-level pages are the source for the tab navigation, with any sub-pages living within those tabs. Blog “posts” live within the Blog page, which is specified within Settings > Reading of WP.

Home Page

The homepage uses a special template (homepage.php) which houses various elements. The left-box houses the “Home” page contents, and is coupled with the Flashfader plugin, configurable inside WP. The purple-headed items are Sub-Pages of the Home Page, and the items below them are WP Widgets, all managed within WordPress.

Top-Level Pages

Diving into a Top-Level Page, some of the CMS features come to life. Starting with the left sidebar, subpages of Services are listed automatically. Below these items is a customizable sidebar of widgets (just a Twitter widget is being used here). Theme code in functions.php automatically creates dedicated Left and Right sidebars for every page for maximum flexibility. I haven’t evaluated the actual load this imposes on the server, but load times do not seem to be severely affected, and WP-Cache takes care of the rest.

In the center we have the contents of the Services pages. If desired, a listing of subpages can be inserted in-line by adding the [list] tag within the page contents. This listing is generated based on variables set in each subpage (for the image) and text processing (to display the snippet). This configuration is not as elegant as I would like, as it requires the use of “custom fields” (which isn’t terribly user-friendly) but allows for thumbnails to appear beside the subpage listing. WordPress has the ability to “attach” a particular image to the post, but I found it to be unreliable and difficult to manage.

The right sidebar stores more customizable widgets. The first is a custom-built widget based on “better-text-widget” and allows for the rounded corner styling along with an image (something that is difficult to do with a default text widget.) The “Testimonials” widget is also custom-built, and randomly selects a quotation from a list given in the backend. The remaining items are simply basic WP text widgets.

Sub-Pages

Strategic Insight is a subpage of “Services”. The breadcrumb behaves accordingly, and the active subpage is highlighted in the navigation. The image browser is SimpleViewer Pro, which allowed us to customize the look and feel of the actual Flash player to match the look of the sight. The sidebars and other functionality is analogous. 

Blog

The blog page behaves just like any other WordPress blog, with appropriate theming for the template.

Other

The only other thing to note would be the Twitter widget, which is based on Twitter Widget Pro, and customized to add a “Follow” button below it and to improve stylability. 

Be sure to check out AffectiveDesign.com to see how they might be able to help you out, or just to checkout how all these WordPress tricks come together to build a very flexible and powerful CMS! 
Mar
12
2010
0

Production: GFS 2010

I recently came to the decision and announced that I would be applying to the BFA Technical Theatre – Technical Production program at the University of Alberta this Fall, transferring from Computing Science. I haven’t really looked back since the realization came upon me, and last night’s Grad Fashion Show was a great reminder of how much I enjoy the production process.

The Show

To summarize, the Grad Fashion Show is a yearly fundraiser for the graduating class at Harry Ainlay. To most, it’s an opportunity to dress up in donated fashions from our local mall, and enjoy some food and do some silent auction stuff. To us, GFS is the technical extravaganza of the year. It started in 2008 when we were approached days before the actual event requesting live video. At first it seemed like it would be all but impossible, but we threw all our best efforts into it and made it happen. We had a single camera, feeding a quasi-analog video card with PowerPoint overlay.

Since then, it’s been an excuse for me to mess with digital video mixing and FireWire cameras. Last year we used VDMX for the video mixing and GrabberRaster in conjunction with Apple Remote Desktop to have a very high-latency secondary camera over ethernet. This year, despite having moved on and graduated, Kevin invited me to return and help out. Before we knew it, we were hatching plans to deliver my Hackintosh and other materials the next morning.

(A shot of Camera A, a Canon GL2 tethered to jQuad running QLab at the 2010 Grad Fashion Show, Harry Ainlay.)

The Rush

After much preparation, it came down to setting up the video mixing software with the two cameras. Luckily the school now has three Canon GL2s (old, but better than nothing). We used one tethered directly via FireWire right beside jQuad (A), and a second on the other side of the gym (B). Camera B was sending an analog signal (FireWire doesn’t work well/at all over long runs) and then fed into the third GL2 which was acting as an analog to digital converter and supplying the second FireWire signal to jQuad.

The software I planned on using, VDMX, did not support the use of two FireWire cameras simultaneously though, despite having two separate FireWire buses on jQuad. After some quick diagnosis, I realized that Plan B, CamCamX suffered from the exact same problem. Both GL2s showed up in “Camera A” and 0 cameras showed up in “Camera B”. Things were beginning to look bleak, not to mention the fact that our lighting personnel had bailed, and time was running short.

(A shot of our video monitoring rig. We initially brought the mini-TVs along for fun, but we ended up needing them to monitor feeds, which aren’t visible in QLab.)

QLab 2 to the Rescue!

So just like those many years ago when QLab came to rescue me from the complexities of In on It, QLab 2 pulled the whole thing off. It had no problem recognizing two FireWire cameras, even identical GL2 models. The Camera cues worked well, albeit there were a few issues with crashing along the way. I suspect it had something to do with the whole Hackintosh/8GB RAM/Crappy Graphics card/Failfest that was going on, but QLab would choke occasionally and I would need a total restart of the program. We rented a $3 license (which was essentially the only thing we bought to run the whole show) so I could easily reload the camera cues after a crash, but overall the cross fades and everything worked very well. In fact, QLab was definitely pushing out the lowest latency and best frame rates out of anything I had tested over the years.

Monitoring the two video feeds was tricky with QLab because that is not entirely what it’s designed for (but perhaps that would be a feature request?). With the help of the extra mini-TVs Kevin brought along, we were able to preview both cameras successfully though.

It was by no means a completely flawless system, but for $3, it was another great experiment in live video, and in particular, digital live video mixing. Learning how to chose the best shot at any given moment takes loads of practice, and this was without a doubt a great opportunity to do it! Most of my friends at Ainlay will be gone next year, so I doubt there will be another GFS, but I look forward to the many opportunities that lie ahead in my technical theatre career, and hope to share them here on jole.ca along the way!

Written by jolephoto in: Personal,Tech Theatre Tags: , , , ,
Mar
03
2010
0

SU – Vote Now!

It’s election day(s) at the U of A! If you’ve opted to not actually check out any of the candidates, you might chose to participate in my experiment in social-media-totalitarian democracy, and vote the way I do! (Yeah right) but if you really have no clue and would like some tips from someone who went to the Horowitz forum (and took notes!) here’s the lo-down.

Don’t bother ranting in disagreement in the comments or anything, because if you have opinion already, this post is not for you!

VP Academic
Who to vote for: Tom L’AbbĂ©
Why: Of the two, Tom seems to have a good plan to improve faculty association-SU relations, and understands that following prof evaluations are not some magic ticket to better teaching. Also, he seems to be more experienced.

VP Student life
Who to vote for: Rory Tighe
Why: For student life, you probably want someone who is bubbly and entertaining, and Rory definitely wins in this category. He also seems like someone who would be on my side in the bringing of Pizza back to SUB, which Kayla seems to have forgotten is important.

VP Op & Finance
Who to vote for: Zach Fentiman
Why: He’s your only choice, plus he’s pretty adorable. Have you seen his campaign posters? Luckily he’s a good choice.

VP External
Who to vote for: Jon Mastel
Why: This was a tough one, but Jon seemed the best experienced to me. They all seemed qualified, but Jon just seemed to emit the least BS.

Undergrad Board of Governors Rep
Who to vote for: Craig Turner
Why: Besides the fact that Sangram wouldn’t shut up about his completely ridiculous concept of informing the student population with video blogs (not even joking, this is basically his platform), Craig seems to be experienced and good ideas to bring to the table. It looks like this is a boring position, and he’s going to dutifully keep it that way instead of spamming my Facebook Inbox with things I don’t care about.

President
Who to vote for: Nick Dehod
Why: As the brief incumbent President, Nick knows a little bit about what he’s doing. He also didn’t try and tell me that he was “endorsed by Stephen Mandel and Daryl Katz” (BS ALERT) like Adam Zepp did, and didn’t seem to be over-focussed on improving the online calendar of events like Vickram. All three candidates are looking to ditch the $550 fees, so that’s a tie anyway.

Millennium Village Referendum
What to vote: Yes
Why: While I understand the reasonings behind “no” (it’s not a direct benefit to the students, it’s not charity unless you’re giving, etc.) I’m just to far left to say no to this one. The fact is most people don’t care, and if I can force this one through so that the people outside Starbucks right now help out a kid in Africa instead of buying another XL Latte, so be it!

U-Pass Referendum
What to vote: Yes
Why: You like your U-Pass right? Vote to keep it going. Or else.

PAW Fee
What to vote: No
Why: I really don’t understand why we get to vote on what students 5 years from now will be paying for. The fee would fund/pay for a new Rec/Activity centre, but would only apply once it’s built…which would be after your time here. I agree with the idea that we shouldn’t be creating costs for future students, so on that basis, I vote No.

Edit: Vote here!

Written by jolephoto in: Personal

TheBuckmaker WordPress Themes Unlimited Webhosting, MP3, AAC & Co