Pacific Aikido is an English-language Aikido dojo operating at various schools within Tokyo. The site has been built with two goals in mind. The first is to provide some information about Pacific Aikido to potential students, and the other is to provide a platform on which the owner can communicate directly with his students and their parents. Therefore there are two sides to the site, the outward facing public site, and a private back-end for current and existing students/parents, requiring a login to access.

Pacific Aikido screenshot
Why Drupal was chosen: 

We at Jaypan are coders at heart. Drupal, while often thought of as a CMS (Content Management System) is actually a CMF (Content Management Framework). This means that at its core, Drupal is a framework, which provides many APIs (Application Programming Interfaces) allowing developers and designers to hook into the system, and create new functionality without having to code it from the ground up. Using these APIs, various developers (including Jaypan) have created the 20,000+ modules available on Drupal.org.

An example of a Drupal API that we have used is the Image API, that allows for the re-sizing of images by the system. We created a settings page that allows the site owner to upload images, and these images are automatically re-sized by the system, and used in the slideshow and the gallery. This means the site owner can update the site at will, without needing to re-size images to specific dimensions, thereby keeping the site from going stale, and hopefully appealing to students who can check back at times and find pictures of themselves.

The contributed modules available for Drupal are an excellent resource for building websites on Drupal. Users with little to no programming knowledge can piece together the modules they need to put together sites with powerful dynamic functionality. However, we at Jaypan prefer to use fewer modules, and code sites to our exact specifications. The Drupal framework provides an excellent resource that meets the best of all worlds -- we can code exactly how we want, but do not have to do it from the ground up, and for certain types of functionality we can use contributed modules that have thousands of users and testers, ensuring powerful, stable code. Add this to the security provided by using the various Drupal APIs, and for us, Drupal is not just our choice for Pacific Aikido, but for all of our projects. We are Drupal developers.

Describe the project (goals, requirements and outcome): 

Pacific Aikido is an English-language Aikido dojo (martial arts school) operating at various private schools within Tokyo. The owner of Pacific Aikido is interactive with his clients, and until now has been providing a professional, personal experience for his students and their parents primarily using email. The owner wanted to streamline his communications with parents and students, in order to provide the best possible services for his clients. As such, the site has been built with two primary goals.

  • The first is to provide some information about Pacific Aikido to potential students or anyone else interested in the school.
  • The second is to provide a platform on which the owner can communicate directly with his students and their parents/guardians, and provide information in a central area where students can reference it when necessary.

Because of the nature of these goals, there are two sides to the site, the outward facing public side, and a private side requiring a login, for students, parents, and staff.

The private side of the site works under the idea of 'groups'. Groups were provided using the Organic Groups module, which allows for private sections of a site, containing content only available to members of that group. Users are added to these groups, and then are able to see their group page, with events, messages, and information about the group. Integration is provided with Google Maps, to show a map for groups that are schools, and school contact information is available to members of the group. The owner can create group-specific pages, and share these pages with whichever groups he wants, ensuring that he only has to enter data one time, while making it available to as many or few groups as necessary.

The site also has a custom Private Message system, which we built in-house, taking advantage of Drupal's extremely powerful Form API, using the Form API's ajax system to load private message threads and messages on the page without ever requiring a page reload.

Additionally, the site has a custom course registration system, so that the owner can create courses, and a custom notification system to inform users of upcoming courses, asking for them to log in and either register or refuse the upcoming terms. All these systems are put in place in order to ensure that everyone knows what they need to know, when they need to know it, and that it is easy to find. The site has truly been customized to meet the needs of the business for which it was built.

In building Pacific Aikido, we looked at other Aikido websites, and it was immediately apparent that they had generally gone in two directions, either showcasing the art of Aikido itself, or focusing on the kanji (Japanese characters) for the word Aikido. We decided to go a different route, to focus on the 'Pacific' in Pacific Aikido. We therefore went with colors that denote the ocean and the sea; clear blues, calming greens and soothing purples. They point back at the fluidity of the water and the fluidity of the movement in Aikido.

Like the ocean these colors are never stable. Links and various elements on the page slowly change in color over time, and changing when the user clicks through pages on the site. Everything is anchored by the warm purple of the header. Subtly but directly inspired from the Dojo setting, the tiles of the homepage banner should remind us of the mat where partners learn the art. The transition is smooth as slides move out to make room for others. Once the transition is complete the grid is again rigid, disciplined.

And finally, we provided a gallery, accessible at the bottom of every page, so that users can see images of the students having fun and enjoying their time at Pacific Aikido, because in the end, that is what it is all about.

Technical specifications

Drupal version: 
Drupal 7.x
Key modules/theme/distribution used: 
Why these modules/theme/distribution were chosen: 

Organic groups provides an excellent grouping system, allowing for the site owner to post content to multiple groups, allowing students to be part of multiple groups, but only allowing students to see content for groups they are members of.

The calendar module provides a great calendar interface so that students, staff, and the site owner are able to see upcoming events before they happen.

The Advanced CSS/JS Aggregation module provides an excellent caching system for the CSS and JavaScript on the site, ensuring that pages load as fast as possible, providing a better experience for users.

The Profile2 module allows us to have multiple contact information on a single user account. For Pacific Aikido, many of the students are minors, and many families have more than one child. As such, we needed to have a single account on to which the student and/or their parents/guardians could log in, with multiple contact information for each student and parent. The Profile2 module allows for this functionality, by providing different sections into which more contact information can be added.

We used a custom Google Maps API module that we developed in-house. This module allows us to quickly add custom Google Maps to the site, with only a few lines of PHP code.

We included custom Private Messaging module that provides a one-page, AJAX-based private messaging system, similar to what you see on larger Social Networking sites.

And finally, as we do on all sites, we have a site-specific module that customizes the site exactly to the requirements of the site, molding existing functionality into the best user experience possible. On Pacific Aikido, this module was used to provide the slideshow at the top of the page, as well as the gallery in the footer, both custom built by Jaypan, using various caching mechanisms and custom JavaScript to make for a clean user experience. The Pacific Aikido module also provides the color shift, that soothingly changes the colors on the page over time.

Organizations involved: 
Team members: 
Pacific Aikido - top page screenshot
Pacific Aikido - gallery screenshot
Pacific Aikido - user page
Sectors: 
Education
Small business
Sports

Comments

duckzland’s picture

jay, nice sliders. custom one?

--------------------------------------------------------------------------------------------------------
if you can use drupal why use others?
VicTheme.com

Jaypan’s picture

Of course :)

halloffame’s picture

Hey Jay any plans on sharing the slider even as a standalone plugin and not as a drupal module?

dddave’s picture

Great job. My only quibble: visiting on a tablet shows zero whitespace on the left.

Jaypan’s picture

Thanks.

sudipto1’s picture

Can you share the idea about the slider you have made? If possible can you share the code?

sidharthap’s picture

Thank you @ jay for sharing such nice website.
Could you please share the enviroment detail also ? configuration in prod and is there any proxy server to maintain the cache?

Thanks
Sidhartha

Thanks & Regards
Sidhartha

Jaypan’s picture

Hello Sidharthap

I am using regular drupal caches only, as well as the Advagg module. The site is on shared hosting, and there is nothing particularly special about the server.

Jay