{"id":3823,"date":"2025-07-13T21:02:31","date_gmt":"2025-07-13T13:02:31","guid":{"rendered":"https:\/\/johorbahru.wordcamp.org\/2025\/?p=3823"},"modified":"2025-07-13T21:54:13","modified_gmt":"2025-07-13T13:54:13","slug":"the-design-journey-wordcamp-johor-bahru-2025","status":"publish","type":"post","link":"https:\/\/johorbahru.wordcamp.org\/2025\/the-design-journey-wordcamp-johor-bahru-2025\/","title":{"rendered":"The Design Journey: WordCamp Johor Bahru 2025"},"content":{"rendered":"\n

Inspired by WordCamp Asia 2023, 2024 and numerous WordCamp around the world, this post is created to show some of design process, behind-the-scene and recommendations to improve, for those who’ll be holding a WordCamp in the future. Hope this helps!<\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Design List<\/strong><\/h2>\n\n\n\n
\n
\"\"<\/figure>\n<\/figure>\n\n\n\n

This is a general designed item list in this conference. Thanks to all generous sponsors liaised by our sponsor team YL Teh<\/a> & Nasim<\/a> , we were able to pull off with a lot of quality and good to have items.<\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

How it All Started<\/strong><\/h2>\n\n\n\n
\"\"<\/figure>\n\n\n\n

The journey began back in early October 2024, I was informed by our lead organizer Yves<\/a>, that he’s applying WordCamp Johor Bahru 2025 and asking If I’m interested to join as an organizer. Upon all the basic info I acquired that time, I decided to buy ticket and visit WordCamp Malaysia 2024<\/a> on late November 2024. During that period, I learnt bits and pieces of WordPress community and WordCamp. On the conference day of WordCamp Malaysia, Yves suggested me to take note of visuals and see what can be implemented in Johor Bahru.<\/p>\n\n\n\n

Big thanks to WordCamp Malaysia 2024 organizer, we are able to acquire some of the remaining equipment such as backdrop, bunting banners, and T-stand, to reuse some during this WordCamp.<\/em><\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Visual Identity<\/strong><\/h2>\n\n\n\n
\n

Logo, Wapuu, Colour, Font<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

The basic key visuals started off with the logo, Wapuu, the colours and font. Logo was designed in emblem style with Wapuu as the main mascot. The crescents were added in the both sides as a resemblance of Johor state.<\/p>\n\n\n\n

This Wapuu named Wacu Japuu is a playful abbreviation combining WordCamp Johor Bahru and Wapuu<\/em>. It features an original Wapuu design with slight modifications, dressed in a traditional Malay male Zapin dance costume<\/em> while holding a globe in the colours of the Johor flag<\/em>. Wacu Japuu was created after the designed of Lepakpuu (JB WordPress Meetup Wapuu). Visit this news<\/a> to learn the full breakdown behind the Wapuu design process.<\/p>\n\n\n\n

The colours started with the blue as the main color and red and cyan blue gradient mix as accent and background colour.<\/p>\n\n\n\n

Font wise, google font is chosen for easier accessibility across multiple digital medium.<\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Social Media<\/strong><\/h2>\n\n\n\n
\n

Social Media Template<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

WordCamp Johor Bahru 2025 social media design consist of cover photos, social media template, profile picture template as well as ads. Learning from WordCamp Asia 2023 Design Journey<\/a>, social media and blog news template were designed in figma, for easier collaboration and content distribution between organizers. Huge thanks to Kamil<\/a> & Nasim<\/a>, for editing and sharing content.<\/p>\n\n\n\n

Figma link<\/a> to view website design, social media and blog news template. (toggle between those at the left side bar.<\/em><\/p>\n\n\n\n

\n

Cover Photos, Profile Picture Template, Ads<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n

To create more versatile looks, cover photos, profile picture template and ads were designed in Adobe Illustrator. Profile picture template were then imported to Canva for user-friendly access to the public while volunteers, speakers and sponsors’ profile picture were sent to them via Whatsapp or email.<\/p>\n\n\n\n

Visit this news<\/a> to check out the profile picture step by step guide.<\/p>\n\n\n\n

\n

Social Media Ads<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Ads size were curated accordingly for each social media, particularly Facebook and Instagram. We applied 2 squares cover design on Facebook multi-image post ads, 1 square cover design on Facebook\/ Instagram carousel post and 1 vertical rectangle cover design on Instagram multi-image post.<\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Website<\/strong><\/h2>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Infuse elements between Johor culture, vector design with mix of quirkiness, the website header was design with the inspiration from WordCamp Ahmedabad 2025<\/a> while featuring Johor’s historical and iconic landmark. As the first WordCamp in Johor Bahru, we took a \u201cJohor-first\u201d approach \u2014 curating content for locals and visitors from across Malaysia and beyond to help them learn, connect, and explore Johor more easily.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

When designing the footer, Yves<\/a> gave a good suggestion that we can feature an on-going construction of RTS (Johor Bahru\u2013Singapore Rapid Transit System) with a slight “hint” of Singapore at the building silhouette.<\/p>\n\n\n\n

One thing to mention, when choosing this kind of vector art as a section in webpage, make sure it can be scaled or repeated properly.<\/em><\/p>\n\n\n\n

Figma link<\/a> to view website design, social media and blog news template. (toggle between those at the left side bar.<\/em><\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Swags | Merchandise<\/strong><\/h2>\n\n\n\n
\n

T-Shirt<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Seeing dry-fit, dye-sublimation T-shirt choice from WordCamp Malaysia 2024<\/a>, we also decided to use the same material and dyeing method as it allows more graphic freedom across canvas. 4 Designs were created and voted. The 2 highest vote designs became our attendees and organizer T-shirt.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo <\/em>by Suzaidee<\/a><\/em><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo <\/em>by Suzaidee<\/a><\/em><\/em><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo by David Gan featuring Eric<\/a> & Jojo<\/a><\/em><\/p>\n\n\n\n

\n

Totebag<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a> and David Gan<\/em><\/p>\n\n\n\n

\n

Lanyard<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Photo by David Gan<\/em><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo by Peng<\/a><\/em><\/p>\n\n\n\n

\n

Name Badge<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Name badge was initially, has only 1 designed featuring the brand’s colour (Attendee). Yves<\/a> proposed different colour based on their identity. After getting badge samples from both WordCamp Malaysia 2024 and WordCamp Asia 2025<\/a>, a white column was added to front of card to write name, while QR Code added at the back which contain important links.<\/p>\n\n\n\n

\n

Stickers<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n<\/figure>\n\n\n\n

We created 3 types of stickers, 1 sheets that’s applicable to normal surface, 2 Wapuu temporary tattoo stickers and also 2 UV transfer stickers (more robust and water resistant).<\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Printables | Venue<\/strong><\/h2>\n\n\n\n
\n

Photobooth Backdrop, Directory Backdrop, Props<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a> and David Gan<\/em><\/p>\n\n\n\n

After seeing WordCamp Asia 2025 box stacking decoration sample, we also implemented on both of our photobooth and track 1 stage.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a><\/em><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a><\/em><\/p>\n\n\n\n

\n

Banner<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a><\/em><\/p>\n\n\n\n

\n

Bunting Banners<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a><\/em><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Photo by Suzaidee<\/a><\/em><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Other than 2 bunting banner designs put on track halls, we also added a bunting design that also double as direction sign and spread across the venue.<\/p>\n\n\n\n

\n

Beach Flag<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n

Photo by David Gan<\/em><\/p>\n\n\n\n

Beach flags placed at 2 entrance as well as at the pedestrian walkway near the venue.<\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Digital Banner<\/strong><\/h2>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\u00a0<\/div>\n\n\n\n

Token of Appretiation<\/strong><\/h2>\n\n\n\n
\n

Card Deck<\/em><\/strong><\/h3>\n<\/blockquote>\n\n\n\n
\"\"<\/figure>\n\n\n\n
\"\"<\/figure>\n\n\n\n

From the start, Yves<\/a> and I were wrestle with gifts that are memorable, fun and unique to keep. Items like bottle, tumblr, power etc were our initial thought. We then switch to Multi-Wapuu style Uno\/ Crazy Eights card. I thought we can create something uniquely WCJB, and convinced him we go with unique version of poker card that features code language and our Wapuu. This card deck is meant to be fun keepsake and part of receiver’s collection. We kept this secret as long as possible before the conference. \ud83d\ude02<\/em><\/p>\n\n\n\n

\u00a0<\/div>\n\n\n\n

Animation Slide<\/strong><\/h2>\n\n\n\n
\n