Vincent Icon
Hi, I'm Vincent Wong.

I'm a Grahpic and User Interface Designer and Front-end Developer. Specialist in Adobe Creative Suite, HTML, CSS and Javascript /

With 20+ years of experience in educational graphic/interface design and web development. Previously worked at MEDM and MERS, one of the biggest and oldest print and digital educational publisher in Hong Kong /

Recently I'm freelancing in Perth WA, working on a couple websites and brushing up WordPress, open to join up with any interested party to design amazing designs /

In my spare time, I love and enjoy cooking for my family and friends. This is one of my way to express my true feeling and passion /

If you think I'd be a good fit for your team, please say Hi and I'd happy to have a chat : )

GFX/UI/FE Designer
Graphic designer / Web developer /
Photographer / Cabler /
Home cook / Wine lover /
Husband / Father /
GFX/UI/FE Designer
A designer with logical thinking /
A programmer with artistic sense /
GFX/UI/FE Designer
Adobe Creative Suite /
Bootstrap / HTML / CSS / JavaScript /
specialist /
iWorkshop Website
Redesign and development of the company website for iWorkshop WA. Aimed to give a new look and feel and create a stronger funtionality /
iWorkshop Sample
iWorkshop Mobile Sample
iWorkshop Creative Brief
iWorkshop Sitemap
iWorkshop XD Protocol

DD - At the beginning of design stage, a creative brief is prepared to visualize design concepts and art styles for stakeholders /

SM - A new sitemap is planned to fulfil the new nevigation structures /

XD - A design prototype is then created with Adobe XD, and with the use of its sharing function to gather comments and feedbacks from the clients /

H5 - This fully responsive site is developed based with Bootstrap 4, HTML, SCSS plus a few Javescript and PHP /

GFX/UI/FE Designer
Australian foundation /
Hong Kong experience /
and Japanese perspective /
MERS eLearning Booklets
Annual booklets were used to promote eLearning services that the company have provided for the schools. Each booklet has its own look and feel, and unique layout design /
eLearning Booklet 2011
eLearning Booklet 2012
eLearning Booklet 2013 01
eLearning Booklet 2013 02
eLearning Booklet 2015
eLearning Booklet 2016

ID - Adobe Indesign was used to complete all layouts of the booklets following the style guide and design created at an early stage. Output files were then proofed and finalised according to the printer's requirements. /

AI - The covers were designed separately in Adobe Illustrator /

GFX/UI/FE Designer
Australian foundation /
Hong Kong experience /
and Japanese perspective /
MERS Website
An major update to the company website, in order to have a clearer structure and allow true responsive. At the same time established an in-house style for the company /
MERS Sample
MERS Design Proposal 01
MERS Design Proposal 02
MERS Design

DD - A design propsal to point out how the use of large image could help to give a feeling of humanity and sympathetic /

DD - Another version of design to demonstrate a style of responsive nevigation /

PS - Since the site involved lots of photo taking and editing, design process is completed with Adobe Lightroom and Photoshop /

H5 - Front-end programmoing is finished using Bootstrap 3, HTML and CSS, then completed with lots of back-end programs /

GFX/UI/FE Designer
Professional in English /
Fluent in Cantonese and Mandarin/
Elementary in Japanese /
Bilingual in design and web languages /
Cambridge Discovery Education Interactive Readers
A project collaborated with Cambridge University Press to develop a straightforward and user-friendly ebookshop /
Cambridge Discovery Education Interactive Readers Sample
Cambridge Discovery Education Interactive Readers Mobile Sample
Cambridge Discovery Education Interactive Readers Design

AI - A simple illustration is drawn with Adobe Illustrator, as well as the layout structure design /

H5 - A simple responsive prototype that is developed with Bootstrap 4, HTML and SCSS /

GFX/UI/FE Designer
Design /
an Art with boundaries /
Front-end Design /
an Art with codes /
"Whiskers & Friends" Kindergarten Education Kit
A crossover project with Ocean Park Hong Kong to create an education website to introduce conservation biology to Kindergarten students /
OPA Sample
OPA Mobile Sample
OPA AI Design

AI - Since the theme needed to forcus on the illustrations taken from the books, the design process is done entirely in Adobe Illustrator /

H5 - This site is developed simply with Bootstrap 4, HTML and SCSS only /

GFX/UI/FE Designer
Graphic designer / Web developer /
Photographer / Cabler /
Home cook / Wine lover /
Husband / Father /
MEDM Logo Design
Required to design a new logo for the company that delivers the impression of simplicity and modish, also able to show the signs of relationship between the four sister companies /
MEDM Logo Specification
MEDM Logo Design 01
MEDM Logo Design 02

DD - A detailed design documentation is prepared to gain feedback and confirmation from the board /

AI - Numbers of different styles and ideas have submitted alongside with some brief design concepts /

AI - An extra work-around and samples based on the final design /

GFX/UI/FE Designer
Design-coding /
Simplicity-innovative-functionality /
Work-life /
balance /
MEDM Website
Required to rebuild a new image for the company, to be a little more moderness and humanity, which could still remain a bit of touch from the parent company /
MEDM Sample
MEDM Mobile Sample
MEDM AI Design

AI - Focused on the use of Google material and flat design concepts, the interface design process is completed in Adobe Ai and Xd /

H5 - This site is designed to be display perfectly in most devices and developed simply with Bootstrap 4, HTML and SCSS only /