Case Study
The Oakland Athletics
Oakland Athletics Intranet
Custom Branding
Custom UI/UX Design
This custom template was created for the Oakland Athletics major league baseball team's office and staff. It's design is completely custom and set to the brand standards and styles, trademark, color and design. It's built with UIKit, and comes with the PageBuilder system to create and build content and media with a simple, visual editor anyone can use without coding.
Note the correct brand logo is automatically changed depending on whether the page has a dark green background or a white one - accurately reflecting the brand's guidelines. Just as one logo is used for home games and White Jerseys, and the other is used for road gamed and dark jerseys.
Again, the custom-designed style is built with UIKit, and comes with the PageBuilder system. Staff can use this to create and build content and media with a simple, visual editor anyone can use without coding.
Applications
Custom CMS Web Applications
Five custom applications were created to handle a wide array of needs. Each application has multiple item types, categories, and several dozen ways it's displayed automatically throughout the site. Each item has it's own access levels, settings and criteria. All applications were built with mass import/export needs in mind, in CSV or JSON formats.
Items
Creating Custom Items
Custom items for each application are made up of individual elements. Some are simple text elements, like a Name or Title. Others are more complex, like Parking Lot open and close times, or a related Event. This makes it very easy to mass import/export thousands of items in bulk. It also enables us to screen individual elements by user access level, and select only specific elements to stream into slideshows, grids, tiles or lists.
The Athletics Homestands (baseball games played at the home ballpark) stream into a slider with tiles & logos of opposing teams throughout the intranet site. We also feed the Game Day, Time and Opposing Team info into a clickable custom calendar.
Design
Using LESS pre-processing, minify, gzip and a CDN - we're delivering clean-coded front-end design loading a simple LESS file in milliseconds instead of the half-dozen CSS files we relied on in the past. Our UIKit-based UI/UX leverages @globals and hooks with zero unnecessary lines of css. the Front-End design is entirely custom and keeps all content branded with the official, trademark and copyright-compliant Oakland Athletics branding. What's more, the back-end Admin interface features arguably the most powerful custom Builder, giving Admins a visual interface to drag-and-drop and choose from simple click or tap icons to create beautiful layouts and graphic content without any coding or complicated mess.
Features at a Glance
-
![]()
Directory
Manages employee profiles, departments they're assigned to, contacts/phone tree and Employee Honors (Employee of the Month and other recognition). -
![]()
Bulletins
Manages inter-office news bulletins, updates and notices. Managers and designated employees with writing privileges and create bulletins and assign them by employee types or department. -
![]()
Homestands
Manages the calendar for upcoming homestands - baseball games played at the home ballpark. Includes detailed information for staff inlcuding vendor locations and names, scoreboard messages, special events and tickets. -
![]()
Mobile
Employees and management can login and access all the intranet tools and content from any device. The UI adapts automatically with fully Responsive Design, responding to touch and hand gestures. Employees can take a photo with their mobile device to update their profile, or add one to an event or bulletin.
"this is how I always envisioned our website. fantastic job!"
Dave Shapiro, CEO, Cartelligent
