The following are some projects which were done after work. Frankly, they are not all good but i still want to post them here because they are all fully or partly built by my hands. =)
North Point Methodist Church
APAN 42 – Hong Kong
Wanna Design
Hong Kong Street Music
PolyYES
i-Dream Beaute
Hong Kong Nutrition Association
Twr y Felin Hotel
Penrhiw Hotel
LightMAC News
SCMP Chinese
Roch Castle
LightMAC Mobile
OMyCar
GNet Star
V Plus A Interior Design
QPon
Newsun
Arcadia LED
Jockey Motor
Happy Learning Assessment & Training Center
GShop
Maven H2O
GNet HK
Beanstag
記得睇波 Football Watch
BHJS Alumni Website
Cultural Masseur
| Launch Date: | 2017 Mar |
| Dev time: | 4 weeks |
| Link: | Cultural Masseur |
| Tags: | Drupal 7, Foundation 5, Docker, Ansible, Bento |
Description: The second project which works with Hong Kong Arts Centre. Will keep adding new features in the coming days. Would take this opportunity to test the continuous integration of Bento.
North Point Methodist Church
| Launch Date: | 2016 Aug |
| Dev time: | 2 weeks |
| Link: | North Point Methodist Church |
| Tags: | Drupal 7, Foundation 5, Docker, Ansible, Bento |
Description: Start using Docker and Ansible in production environment. Finally the continuous integration feature of Bento is done. And np more no more tedious tasks in Drupal Maintenance.
APAN 42 – Hong Kong
| Launch Date: | 2016 May |
| Dev time: | 2 weeks |
| Link: | APAN 42 – Hong Kong |
| Tags: | Drupal 7, Commerce, Foundation 5, Bento |
Description: A Drupal Commerce setup with Commerce Registration provides the online registration function. Commerce No Cart for skipping the cart and checkout pages but this leads to a big problem on setting up multi currency. Development includes the Bento features which were developed a few months ago and it works pretty well on the layout arrangement.
Things could be improved: Just like to old stories… haha…
Wanna Design
| Launch Date: | 2015 Nov |
| Dev time: | 4 weeks |
| Link: | Wanna Design |
| Tags: | AngularJS, Foundation 5, Browserify, Skrollr, Scrollmagic |
Description: This is my first AngularJS project. Before the implementation, i spent some times on integrating the Browserify and Foundation with AngularJS seamlessly as well as some coding practices and design patterns in AugularJS. One of them is Angular Style Guide written by johnpapa. I also tried RequireJS but finally give up and use Browserify instead.
Things could be improved: Skrollr is good if you only need one type for scrolling effect. Otherwise Scrollmagic should be used instead. Patient is definitely needed to write good code.
Jockey Club Street Music Series
| Launch Date: | 2015 Apr |
| Dev time: | 3 weeks |
| Link: | Jockey Club Street Music Series |
| Tags: | Drupal 7, PHP, Javascript, JQuery, LESS, Responsive, Bootstrap 3 |
Description: A project from Hong Kong Arts Centre. Thanks Sherin Siew who designs the website and invites me to do the backend programming part.
Things could be improved: I seldom do responsive website because it usually makes the project complicated and hard to maintain. Moreover, the reward from the client could never meet the effort you spend on the development. But this is an exceptional case as you can see the design is quite clean. In addition, this is the first time i used the Bootstrap theme in Drupal. The setup is a bit tricky but still manageable. It’s a nice theme to work with. But need to do some extra steps in order to make it work in IE8.
Also tried Cycle2 plugin, it’s good for image slideshow but if you are working with divs make sure you won’t have float element inside as Cycle2 will make them position absolute.
PolyYes
| Launch Date: | 2015 Mar |
| Dev time: | 1 week |
| Link: | Poly Yes |
| Tags: | Drupal 7, PHP, Javascript, JQuery, SASS |
Description: Campaign website for Institute for Entrepreneurship of Hong Kong Polytechnic University. The client is a friend of Philip Wong.
Things could be improved: Simple and straight forward project. The design is a clone of an existing website and turns it into Drupal CMS. Just need to pay attention to some campaign logic resetting the campaign year and content. Usually the client never realize thise backend logic so need to spend some effort on clarifying those requirement.
i-Dream Beaute
| Launch Date: | 2015 Jan |
| Dev time: | 2 weeks |
| Link: | i-Dream Beaute |
| Tags: | Drupal 7, PHP, Javascript, JQuery, SASS |
Description: A Drupal 7 site for a cosmetic company
Things could be improved: Implement the Simple 3d Coverflow. This plugin has a good visual effect but not easy to configure it properly. Also try the Skitter Slider on the landing page which is quite easy to use.
Hong Kong Nutrition Association
| Launch Date: | 2014 Dec |
| Dev time: | N/A |
| Link: | Hong Kong Nutrition Association |
| Tags: | Drupal 7, PHP, Javascript, JQuery, SASS, Ubercart |
Description: A Drupal 7 site with Ubercart for membership renewal.
Things could be improved: Nightmare! Chaotic renewal logic which the client doesn’t mention before the project starts. I doubt if they could present the logic in a proper way. The project started one and a half year ago and i just dun want to talk about it. Anyway, just want the warranty period will end ASAP.
Twr y Felin Hotel
| Launch Date: | 2014 March |
| Dev time: | N/A |
| Link: | Twr y Felin Hotel |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: Just another clone of the previous two websites.
Things could be improved: N/A
Penrhiw Hotel
| Launch Date: | 2013 May |
| Dev time: | About 1 month |
| Link: | Penrhiw Hotel |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS, Ubercart |
Description: Complicated business logic for booking. Nothing much to say…
Things could be improved: Again, i will never make the same mistake again…
LightMAC News
| Launch Date: | 2013 May |
| Dev time: | About 2 weeks |
| Link: | LightMAC News |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: A news section is added to the website. Multilingual and Views Galleriffic module for the article slideshow.
Things could be improved: I think the Views Galleriffic is a very good module to implement the slideshow. However, it comes to a problem when i tried to integrate it LightBox2. If you are not sure about the project requirement. It’s better to implement it using jQuery Cycle Plugin instead since it is easier in terms of customization and integration.
SCMP Chinese
| Launch Date: | 2013 Mar |
| Dev time: | 37 days |
| Link: | SCMP Chinese |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: Another technically challenging project. A website for news about China and Hong Kong. I have written altogether 9 custom modules.
Things could be improved: Being given an enough development time is always a key to create a successful project. I was given enough time to work as an system architect at the very beginning of the project, otherwise, the change requests raised during the development can never be completed. Unfortunately and like many other IT projects, it became chaos and things just went uncontrollable. Frankly, i think i have done a good job otherwise it cannot be done in 37 days.
Roch Castle
| Launch Date: | 2013 Mar |
| Dev time: | About 2 months |
| Link: | Roch Castle |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS, Ubercart |
Description: A caslte hotel booking website in Wales. Technically it is very challenging because i need to make use of the Hotel Booking System for Ubercart module and actually it is not well supported. So i have to hack into the module in order to complete the booking feature.
Things could be improved: A very good lesson to me on how to deal with the client. I swear i will never make the same mistake again!
LightMAC Mobile
| Launch Date: | 2013 Feb |
| Dev time: | About 2 weeks |
| Link: | LightMAC Mobile |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS, Media Query |
Description: Another project offered by Benny @ Wanna Design. This is a mobile website for a cosmetic company in HK.
Things could be improved: I seldom work for mobile website project and it’s really challenging because of the tight deadline. Another headache is the responsive feature implementation. The design made use of a high resolution background images and it is hard to make them responsive. Finally I had to do a lot of CSS coding in order to fit the different device widths. Nightmare!
OMYCAR
| Launch Date: | 2013 Feb |
| Dev time: | About 5 weeks |
| Link: | OMYCAR |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This is a forum based website where visitors could register their own account and create website content such as forum posts. The idea is just like OpenRice but it serves for garages instead of restaurant. The website is designed by Benny @ Wanna Design.
Things could be improved: I underestimated the scope of this open registration website. It cost me much more effort than i expected but it was a good experience to me. Technically it was not well built becoz of the tight deadline and change requests kept flowing in the final phase.
GNet Star
| Launch Date: | 2013 Jan |
| Dev time: | About 3 weeks |
| Link: | GNet Star |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This is another project for the GNet client. It is a Drupal 7 website which is competition announcement purpose. Technically, there is nothing special. Again, the most challenging part is the client keep adding new requests during the development. So the Drupal structure is not good.
Things could be improved: Technically nothing.
V Plus A Interior Design
| Launch Date: | 2012 Dec |
| Dev time: | About 2 weeks |
| Link: | V Plus A Interior Design |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This project was completed about half an year ago but it takes a long long time for the client to start using it. Do they really need a website? haha~~
I love the design of this project which is done by Benny from Wanna Design. Clear and elegant except i think having a background music is a bit old school.
Another feature which i want to mention is the homepage slideshow. I purchased a library from CodeCanyon. This lovely slider called KenBurner Slider jQuery Plugin and is written by themepunch.
Things could be improved: Not much to say actually, i always try to keep the project simple and i think i have done it. =D
QPon
| Launch Date: | 2012 Nov |
| Dev time: | About 3 months |
| Link: | QPon |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This web application is my personal project. It is a free online coupon platform for both shop owners and customers. The motivation of this project is to provide a free platform for the shop owners to promote their brand and products by offering discounts to customers. On the other hand, customers could find what they need in QPon.
I spent a lot of time on the home page presentation. You can see that the coupons are flowing in the pool and its size depends on the redemption ratio. The more people redeem it, the bigger it is until it meets the redemption quota. I hope the shop owners could make use of the room of the pool and design their own coupons.
Unfortunately, this idea is somehow not welcomed by the shop owners in Hong Kong. Anyway, I think QPon could run any cities in the world. If you are interested in this idea and want to try it in your home city, do let me know. =D
Newsun
| Launch Date: | 2012 Oct |
| Dev time: | About 2 weeks |
| Link: | Newsun |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This is a website i work for my friend Alex Wu. Newsun is a company specialized in manufacturing lithium batteries. For more information, please send your enquiry through this form.
Things could be improved: I implemented all functionalities before finding Wanna Design to design it. But the final output was quite different from what i expected. Similar to what i experienced in other projects, the biggest problem which i always find in website projects is that the client always underestimates his role for building the website. This greatly hinders the progress of the development.
Arcadia LED
| Launch Date: | 2012 July |
| Dev time: | About 1 week |
| Link: | Arcadia LED |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This is a website for my friend. He was my classmate when i was studying in graduation school of CUHK. His business is LED lighting and if you are intersted, contact him by filling in this form.
Things could be improved: In this project, i made use of a ready made theme called BlueMasters. So it saves a lot of time in development. Probably this is the most simple project i have ever had. =P
Jockey Motor
| Launch Date: | 2012 June |
| Dev time: | About 1 week |
| Link: | Jockey Motor |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This was the third project i worked with Wanna Design. It is a cars and car registration numbers trading website.
Things could be improved: This project only took about 1 month from quotation to launch. Well, much better than what i have experienced in the past. =P
Happy Learning Assessment & Training Center
| Launch Date: | 2012 June |
| Dev time: | About 2 weeks |
| Link: | Happy Learning Assessment & Training Center |
| Tags: | Drupal 7, PHP, Javascript, JQuery, CSS |
Description: This was the first website i created after i start being self-employed. It was the first project i worked with Wanna Design which is a very nice and youthful design studio. It was also the first project i built with Drupal 7. The center provides different services for children and helps them to grow healthly.
Things could be improved: I am satisfied on what i did. But it took about 5 months to put the website into production but the dev time was actually very short. The bottle neck was always there at the client side. And like other typical projects, very often the client only looked at the layout seriously only when everything was almost done. What is think is that if people commit more in the very beginning, the output could be very difference.
GShop
| Launch Date: | 2012 May |
| Dev time: | About 3 months |
| Link: | GShop |
| Tags: | Drupal 6, PHP, Javascript, JQuery, CSS |
Description: This was the phase II of the GNet project and finally it was launched. Nothing much to say as this is a badly managed project.
Things could be improved: Never let the client take control of the project.
Maven H2O
| Launch Date: | 2011 Nov |
| Dev time: | About 3 months |
| Link: | GitHub – ykyuen / maven-h2o |
| Tags: | Maven, Java, ebMS, AS2 |
Description: This is the Maven version of H2O which i created when i was working in CECID in 2009-2010. H2O is an electronic message gateway that supports protocol standard including ebMS and AS2.
Things could be improved: I didn’t build the H2O. What i did is to turn it from a legacy ant build Java project into Maven. But actually i still used the maven-antrun-plugin for deployment since the original deployment process is a bit complicated. The H2O project is one of my favorite projects because this project allows me to learn Maven from zero and i finally did it. Also, i know many great teammates in this project and they teach me a lot of stuff. =D
GNet HK
| Launch Date: | 2011 Nov |
| Man hours: | ~300 |
| Link: | GNet HK |
| Tags: | Drupal 6, PHP, Javascript, JQuery, CSS |
Description: GNet HK is a website about education. Just like openrice but for learning centers. It is a Drupal 6 website.
Things could be improved: This is the first freelance i accepted on my own and it was a very good lesson for me to learn how to handle customer even thought i did quite bad in this project. First the requirements are unclear and the client kept throwing new requirements which reduces my motivation to develop the site. Second, i used too many Javascript so the site response slowly in IE. In general, the architecture is weak and probably has no much room to scale up.
Beanstag
| Launch Date: | 2011 Jun |
| Dev time: | About two weeks |
| Project Link: | Beanstag |
| About Beanstag: | BeansTag – Official release BeansTag – Override existing meta tag if it already exists BeansTag – The SEO tool for Drupal 7 BeansTag update |
| Tags: | Drupal 7, Beanstag, Meta tags, SEO |
Description: BeansTag is a page title, meta tag and meta description management tool. It makes use of the path alias as an identifier for the SEO attributes. You could add them to any path alias and they would be shown in the webpage. It fully supports any pages including views, panel pages as well as nodes. BeansTag now supporst Token and you can use * in BeansTag path alias. Please refer to BeansTag update for those new features.
Things could be improved: This is the first Drupal module which i published to the drupal.org. So i do believe there are many things which could be improved, especially the code structure and some Drupal coding standards. Thanks Chris Pang for his help on the quick link so users can update the page title, meta tags and description in a much convenient way. And it is finally approved. If you have any problems with the module, feel free to submit an issue on the BeansTag project page.
記得睇波 Football Watch
| Launch Date: | 2009 Dec |
| Dev time: | About 3 months |
| Link: | 記得睇波 Football Watch |
| Tags: | Android SDK 1.6, Java |
Description: A small application which stored the results of different soccer leagues. Asynchronous update is support. But seems that the app owner does not provide any support to the app now.
Things could be improved: This application is also a team product which i worked with my 3 secondary schoolmates. It was completed but we didn’t plan what is the next thing to do or how to make it better. But i already feel happy with this app because this is the first mobile application and it is completed. =)
BHJS Alumni Website
| Launch Date: | 2009 Apr |
| Dev time: | More than half a year |
| Link: | Bishop Hall Jubilee School Alumni |
| Tags: | CakePHP, PHP, Ajax |
Description: This is my secondary school alumni website. The first product with my 3 secondary schoolmates. It is built on top of the CakePHP framework and i learnt a lot about running a Linux server and working with SVN and Mantis. A good experience on Linux and MVC framework.
Things could be improved: Technically nothings to complain. The worst thing is that the alumni committee members never realize that they need to learn how to use the website and actually most of the requirements and features are from myself and my schoolmates. =.=
Eureka! 