Stephan Church - Web Design / Artist / Animator / Coding
David Klingler - JS/Php Troubleshooting
May 2021 - June 2022
InDesign | Illustrator | Local | Photoshop | Visual Studio Code | Woocommerce | Wordpress | XD
The website was created to capture nostalgia using traditional design trends. The container was made more tight to add intrigue and primary colors were chosen due to their use in traditional pokemon brand use. I worked with the client directly to get a better sense of his brand identity. For more information, refer to the design document attached below.
The website is fully responsive, working on all operating systems and screen sizes. The shopping experience on mobile is modified to expedite the shopping process compared to the more exploratory design used for desktop screens. Below images showcase how the site runs on mobile devices.
Based on an already established IP, I already had an established design language to work with. TCA is hyper focused on the nostalgia of the IP so rather than copying the current design language, I focused on abandoned 90s concepts. This included a focus on the classic Sugimori art style that once defined the series.
It was a bit harder when creating art based on complex marketing imagery. In this case, I preserved a large part of the details, but limited my palette to painting with two tone art with a white lighting effect to create visual cohesion.
I purposely locked the avatar system to avatars that I designed to keep the users immersed in the visual style of the site. I created the avatars with the Sugimori art style in mind.
As part of my maintenance contract, I offer one new slide for the front of the site. Below are just a sample of a few of the slides without text. For some of the products, I break my visual rules to make the visuals stand out. This also allows for faster conversion to keep slides current.
The site uses appropriate Wordpress and Woocommerce hooks to allow for communication to the theme through the backend of wordpress. I conduct regular maintenance to ensure site maintains continuity.
Group Based Discounts
Using plugins, users receive automatic discounts based on their group. I wrote scripts that streamline discounts and displays the icons for discounted items.
Custom Avatar System
Custom Shopping Menu
I made a customizable shopping menu on the header of the site. The menu is adjustable through Wordpress and offers a dynamic shopping experience in a responsive layout
For my first website, I picked up quite the technical challenge. I wasn't sure what to expect when working on an ecommerce website, but I believe this project was a good test of my technical skills as a coder and my ability to create design solutions based on client needs. I currently still maintain and provide additional work for this client.