Here you’ll find a collection of my previous work experience. Please note that some of the sites that I have worked on have changed drastically since I had any involvement with them and I honestly can’t guarantee that any of my work is still available for viewing.

Verold Inc.

I worked at Verold from September of 2012 to November 2013. The Verold studio is unlike any project I’ve ever worked on. What were attempting to do is create an online game development platform using webGL technology. At the moment though, the studio is not a full fledged game dev platform but what Verold has achieved so far is still impressive. 3D modelling artists have the capability to upload their 3D content, in the form of models, including textures, to the Verold studio and display them in fully rendered 3D. Once the model has been uploaded to the studio, artists can manipulate lighting effects, and other properties of the 3D “scene”. Artists can also tweak model properties such as scale, rotation, texture mapping, the list goes on.

My involvement with the Verold team is developing our interface and improving the user experience of the studio application. One contribution to the studio interface that I am proud of is the UI elements that comprise the various “inspector” interfaces. Inspectors are graphical groupings of UI elements that read properties of, and allow manipulations of objects and assets available within the studio application. Typically, inspectors are responsible for interfacing to one object or asset at a time. As a result, the inspector pattern usually is facilitated by flexible “panels” in a user interface. There are many examples of my work within the Verold studio application, but you’ll have to sign up and play with a model in the 3D scene to see what I’m referring to.

The Technology Stack

Verold is using some pretty cutting edge tech at the moment:

MongoDB – noSQL database solution – Stores all data related to Verold Studio operation, users, projects, assets.

Node.js – system back end powered by node and all the associated tools: npm, nvm, express, mongoose.

Handlebars – Templating language designed for use with JavaScript. Used on front end and back end.

LESS – A CSS preprocessor. Allows for more flexible expression of CSS which compiles down to regular CSS. Designed to make writing CSS easier.

Twitter Bootstrap – Bootstrap is a front end development framework, which contains a number of out of the box UI patterns that can be used right away. Also, it comes supplied with a number of LESS mixins, allowing for quicker development of CSS.

Backbone.js – Backbone helps provide some structure to large front end applications. It also simplifies interaction with web based restful applications. You can set up backbone views to watch for updates to backbone models, simplifying front end application design, among many other features.

jQuery – jQuery is the go to library for DOM manipulation and AJAX functionality, in fact, Backbone.js is built largely on jQuery’s core strengths. One thing about jQuery is that it doesn’t lend itself well to enforcing application structure. That’s where Backbone comes in.

HTML5 – The biggest feature of HTML5 that Verold is currently utilizing is webGL. Without it, there is no 3D rendering application. Other HTML5 features we are using include: canvas image data, file objects, native drag and drop, localStorage, etc.

CSS3 – We are using CSS3 features heavily. Vendor prefixes are kept in check when using Bootstrap LESS mixins.

One thing to keep in mind with the Verold studio is that it won’t work on IE <= 9, since Microsoft has decided not to support webGL. Perhaps they will decide to support it in future versions of Internet Explorer (fingers crossed).

Work Examples:

Verold Inc. – You’ll have to sign up and create a project with a model to see the 3D scene and it’s user interface. I recommend taking the introductory tutorial when you first enter a project scene. My contributions are varied throughout the side as well, not just the project scene interface.

Canadian Broadcast Corporation

I worked at CBC from October ’08 to September ’12 contributing to a number of projects while there. When I started at CBC, it was as a front end developer. In August of 2010, I was promoted to senior user interface architect. As UI architect, my role consisted of:

• Over seeing developers with regard to front end development.
• Consulting on industry best practices during requirements gathering phase for various projects.
• Creating design specifications for concrete implementations of front end applications.
• Architect and designer of software components that are used site wide on cbc.ca.
• Providing software development expertise for back end systems.
• Responding to and providing assistance via a incident/request ticket system.
• Working with YUI2/3 JavaScript library in order to normalize cross browser incompatibilities.
• Working in a UNIX based environment with a suite of tools such as Subversion, Bash, Eclipse, Apache2, Tomcat 5.5, Maven 2, PostgreSQL, – Movable Type 3/4 and my absolute favorite text editor, VIM.

While the UI architect role involves creating high level solutions for a broad range of scenarios on the cbc.ca web site, it also still involves all of the development and system administration skills necessary to perform the developer role.

Work Examples:

CBC’s Hamilton Local Service Extension – CBC’s first foray into the world of Responsive Design. This was a challenging project as CBC has favoured fixed width designs for many years now and with good reason. Fixed width layouts tend to deal well with constant adjustments. As audiences demand change, CBC has been able to stay agile in leveraging what is produced by their CMS solution within fixed width layouts. For the Hamilton project, my biggest challenge was to determine how best to use CMS produced components into a responsive design meant to be consumed by a wide array of devices. In the end, we opted for something more accurately described as “Adaptive Design”. Adaptive design will display content for a specific set of devices, in our case, iOS, Android, Blackberry and traditional desktop browsers, by dynamically adapting the design for various screen width thresholds. For everything else that CSS3 Media Queries could not handle, we used ESI user agent detection at Akamai edge servers to deal with complicated server side logic.

CBC’s 2011 News Redesign – Provided technical consultation through project requirements gathering/discovery phase. Architectural input and implementation of news navigation system, which provides a site wide “breadcrumb” style navigation, configurable via XML. Instrumental in guiding designs of story pages and news sub category landing pages.

CBC’s Canada Votes 2011 – Technical consultation during requirements gathering/discovery phase. Instrumental in organizing front end assets to be used on 308 riding pages. Developed PHP script which automated the process of generating the 308 riding pages, ensuring all the relevant information for each riding was included on each riding page. Participated in development of front end user interaction, specifically the riding selection menu.

CBC’s Weather Information – 2009 – Programmed, in Java, the back end solution for gathering weather information from Environment Canada and WSI Inc. and presenting the data via a freemarker template system. The application gathers information every 15 minutes from it’s sources and has been running in production problem free since 2009. Also, I oversaw the front end development of the templates used to present the weather data. Additionally, I was required to make updates to CBC’s server side geolocation solution as part of the project. The geolocation application is a Java web application running in Tomcat 5.5. This work entailed updating a postgreSQL database schema with a new table containing all the weather centers across Canada that CBC was concerned with. When a user visits cbc.ca, a location is selected based on the the closest match in CBC’s database with their latitude and longitude.

CBC’s Omniture Site Catalyst Implementation – 2009 – The goal of this project was to replace the HBX based site wide analytics tracking system with Omniture’s Site Catalyst solution. This was a challenging project as the previous HBX implementation did not cover all of CBC’s research department’s needs, so I had no working template to draw from for technical insight. On top of that, the client side tracking solution would have to be integrated into various content management systems, some of which are quite a challenge to work with. In the end, the project took about a year to complete, but CBC’s research department now has more data to work with than ever before.

Henderson Bas Kohn

From 2007 to 2008, I worked at Henderson Bas Kohn (at that time know as Henderson Bas) as a front end developer. As front end developer there, my role consisted of:

• Maintenance of various client sites such as icoke.ca, molsoncanadian.ca, molsoncanadian.com.
• Applied knowledge of HTML, CSS, JavaScript, JSP, XML, Tiles template system, MooTools JavaScript library, SVN, CVS, PHP

Work Examples:

I would provide some, but, as I said, many of the sites I worked on at this time have changed so much that my work is long since replaced by new endeavors. Here is a list of sites I worked on for completeness sake anyway:

icoke.ca – General ongoing maintenance of online property using JSP, CSS, HTML, JavaScript. Site was built previous to my joining the Henderson Bas Kohn Team.

molsoncanadian.com and molsoncanadian.ca – Ongoing maintenance as well using PHP, CSS, HTML, JavaScript.

Offshoot Inc.

Offshoot is where I cut my teeth starting back in 2006. Offshoot was a small team back then. 5 people at the most at any given time. Working with a small team has it’s advantages, like ad-hoc project management, giving the flexibility to roll with the changes as a project matures. But, with any small team, there is only so much bandwidth. I learned a lot at Offshoot and owe it tribute as my first foot in the door in the web development industry. Most of the projects I worked on there were smaller scale due to the size of the team. My role there as sole front end developer consisted of:

• Providing knowledgeable input on user interface design, specifically, ease of use.
• Taking design mock ups and creating web standards compliant, functional XHTML/CSS.
• Use of JavaScript (AJAX) to access XML from web services and present data in XHTML using web standards compliant code.
• Create interactive user interfaces with ActionScript 2.0 driven flash applications.
• Use of Object Oriented Design patterns in both ActionScript and JavaScript in order to create effective and highly reusable code.
• ActionScript 2.0 programming, accessing XML and presenting data dynamically.

Work Examples:

Fox Flight Ambulance Coordinator – Created working layouts/designs of air ambulance coordinating application. Technologies used were primarily HTML, CSS, and JavaScript.

Canadian Federation of Students Administration System – Implemented front end of custom built content management system for the Canadian Federation of Students. This involved creation of working HTML/CSS templates for many different “looks and feels”. These templates served as a means of differentiating content managed, full fledged informational sites used by student unions across Canada.

Inquiries:

If you have any questions about the work I have done, please feel free to ask me at: acepukas [at] gmail [dot] com

I look forward to hearing from you.