Manulife Team Web Development

Manulife team manager, Jocelyn Ang’s website

This project right here is probably the reason how I’m getting into the freelance business. Started like any other dinner chit chats when my old time buddy, Jackson asked me about my diploma studies. Then one thing led to another and I landed my first paid freelance job!

I couldn’t thank Jackson enough for opening up this door for me as it landed me some other projects and making it possible for me to earn some extra cash while being locked in my room (joke intended).

Anyway, the team wanted an online presence where they could have an online portfolio with testimonials, achievements, services and quick contact information for potential clients.

Jocelyn’s team achievements is also hers to share here

an easy view of all testimonials collected

The web uses a really simple and straightforward approach for clients to easily find the information they want easily. Therefore, in order to contact the agent, all they need to do is use the form to send an email to them instead of the standard “mailto:” function.

Actually, the “mailto:” function is one that is underused by the visitors but overused by developers. I personally do not use any email client program on my computers and never knew anyone who did. So when they click on the email link and it pops open the email client, everyone will simply close them and perform a Copy n Paste in their web email client.

an optimized contact form by me

Before development of any website, I would make it a point to discuss with the client what would suit their needs and their customers’ needs. This is a phase that I believe can never be overlooked and is what web developers live for, making the web a better place for everyone. Sounds too great a task? It never is as we develop and improve one website at a time.

This is my first attempt at a freelance job and there are places I definitely want to improve. So plans are underway to revamp it!

Visit their site from www.jocelynang.com

Nature Studios Singapore – Web Programming

The home page of Nature Studio

This is a voluntary project for one of my lecturer’s personal studio, Nature Studios. They are a professional studio involved in video production for Singapore’s Mediacorp and other cable channels. (Hope I can have my own studios in the future too)

This is the first collaboration between me and my fellow classmate, Huili, who is one of the best in the graphics department. So if you think the site’s visually appealing, its all her. I’m just the guy who made all the buttons and forms work…haha!

I’m not trying to boast or beat the previous developer down, but I think we did bring the website from the 90s era of web design to the current era.

the old site was developed fully in Flash

At first, the client wanted a Flash version again but we warned against it as Flash does add interactivity but does not go well with mobile browsing (yes, I’m talking about iOS) and easy updates. Plus there were not too much interactivity to boast and so we promoted the use of JQuery for increased interactivity.

Another request from the client was that he should be able to update the videos and news easily. So for the news section, I suggested to hook it up with Twitter and so they could always update about their current projects and status on the go with the help of an app. The advantages are huge and of course also puts the company into the web of social media. I used the Twitter plugin from Seaofclouds.com which helps you to extract your tweets and also insert words to make your updates sound personal like…

 

 

 

The video container in the first screen cap was developed using the Moving Boxes JQuery plugin and it works really well whenever you have a gallery/articles to show.

99.9% of the time you will end up with clients that are not web programming savvy (and that’s why you get the job). So I need to develop a simple admin module for uploading videos and in order to work with the lightbox plugin, Colorbox, videos in Youtube was the only way. I did try to host their videos on their server to play but making sure the video plays in all major devices (yes, I’m still referring to iOS) was a great obstacle. Hope HTML5 catches on with the mobile browsers and that will be a worry of the past.

So with some PHP magic and Youtube developer hacks for getting thumbnails, I managed to pull it off! Wonder how I did it since I’m posting this about a month after completion.

admin just needs to copy the link after the ?

Of course the admin can also edit the videos after uploading. The client also wanted to restrict preview of their content. Did it using the Youtube’s “Unlisted” function and PHP verification.

This is one of the few times, I would develop an admin module from scratch but the advantages are huge as you can control exactly what your clients can see or do as compared to using Joomla! But to do one that is as huge as Joomla!, it will take months for a one man army like me.

You can visit their site at http://www.naturestudioz.com