https://mobilunity.com/blog/web-and-mobile-development-for-american-football-team/ A new WordPress football team website and a hybrid sports mobile app were developed for American Football team “The Bulldogs”, which is located in Kyiv, to raise football awareness locally and abroad. American football website and app were planned to serve as an information portal to provide such information as: - get acquainted with the team members and coaches; - find the team’s office location on Google Maps; - find out how to join the Bulldogs; - get informed about upcoming events and match stats; - check out the Bulldogs’ communities on social networks; - add the Bulldogs icons to your photos at the mobile app etc. The multipurpose sports mobile app and website are synchronised for successful work, and our client’s business requirements were met. Like the idea of synchronization of an app and website? Get a free quote now and develop your business through this effective way as well!

1. BULLDOGS
CASE STUDY
WordPress website and hybrid mobile application
development for American football team

2. 2
THE CHALLENGEThe Team
Project Manager
2 WordPress Developers
Full Stack Developer
QA Engineer
Technologies used
While creating the website and the app
for the Bulldogs team we used
technologies which proved to be useful
for hybrid and web development:
HTML
CSS
JavaScript
WordPress
WordPress Sporting Club & Centre
Theme
WPML WordPress plugin
Ionic
AngularJS
Cordova
Node.js
ActionHero framework
Invision
At Mobilunity we tend to work with clients from
Western markets, so the opportunity to work on an
interesting local project does not come by very often.
We were however recently given that opportunity.
Our client - the Kyiv Bulldogs - an American Football
team located in Kyiv requested that we create a
website and a mobile application for the team and its
fans. American Football isn't a very popular sport in
Ukraine, and this website and mobile app project was
designed to help raise awareness locally and abroad.
The website and the application were planned to
serve as a sort of information portal for people
directly involved in American football and fans as
well, still it had to clearly manifest the identity of the
Bulldogs team.
The plan was to give users the ability to:
Get acquainted with the team members and
coaches
Find out information about the team
Find out how to join the Bulldogs
Find the team’s office location on Google Maps
Get informed about upcoming events and match
stats
Check out the Bulldogs’ communities on social
networks
Read interesting blogs about the Bulldogs team
and American Football in Ukraine
Decorate photos with the Bulldogs icons and logo
(mobile application)
So far the Bulldogs website is ready, as well as the
mobile application, which can be downloaded from
Google Play.https://play.google.com/store/apps/details?id=com.mobilunity.bulldogs2
“Yet again our team benefited from
WordPress technologies this time in
creation of extraordinary
multipurpose website. This helped to
optimize web development, though
building a responsive hybrid
application was quite a challenge.
Still, thanks to considerable expertise
and experience of our developers
that didn’t become a barrier!”
Kate, Project Manager

3. 3
THE CASE STUDY
The Bulldogs had a clear vision for the website and the
application at the very beginning of our cooperation. So
the only thing our team had to do was to offer the most
optimal ways of executing the client’s requests. After the
business requirements were clearly stated, our PM got
down to defining technical specifications and
consequently got them approved by our client. Other
than the demands from the Bulldogs, our team here also
suggested adding a few functions to the app to make it
more entertaining and engaging.
BUSINESS ANALYSIS
TECHNICAL
REQUIREMENTS
The website was developed using WordPress and the
mobile application is synchronised with the website as
the content and updates for the app are constantly
pulled from the website’s MySQL database.
The app is targeted at a narrow group of people -
American Football fans and teams in Ukraine. Thus,
developing a native app would be inefficient and too
costly. Due to this and the fact that the app is going to be
integrated with the website to get constant updates and
content changes, the decision was made to opt for
hybrid development. The app is compatible with Android
4.5+ and iOS 8+ devices.
Both projects (website and app) were planned in
Redmine - the tool, which Mobilunity traditionally uses for
project planning and progress tracking. Weekly
stakeholders were updated by our PM on the status of
the project, including the scope of work completed and
planned, as well as the time spent vs time initially
estimated.

4. 4
WEB DEVELOPMENT
Since the Bulldogs are an American Football team with
its ready-made emblem, there was no need to create a
logo from scratch and Mobilunity’s team of designers
simply tailored the existing logo to fit the overall website
and app design. To reduce the cost of the design
WordPress Sporting Club & Centre Theme was
purchased and customised for the needs of our client.
HYBRID APP
DEVELOPMENT
To fulfill the specifications of the mobile application Mobilunity developers used the
following technologies:
Frontend
Ionic for frontend visual part
AngularJS for frontend logic
Cordova for building mobile web view
Backend
Node.js

5. 5
Gallery
Images and video available on the website are displayed in the Gallery
Images and video are opened in the pop-up window
Gallery categories are displayed
Blog
All the articles from the website are displayed in the Blog
Social sharing is provided by the Cordova existing solution (the user can share an event
through VK and Facebook social networks)
All the comments from the website are displayed on the Article page
About us
The content for the About Us page is pulled from the corresponding page from the
website
Social sharing function is provided by the Cordova framework (the user can share an
event through VK and Facebook)
Contact us
Contact information of the Bulldogs team is displayed on the Contact Us page
Telephone number and Email addresses are clickable
Our team of frontend developers provided the application with the following functionality:
Splash screen
Splash screen is displayed during the application launching
Calendar/Events
The list of all events available on the website are displayed on the Calendar page
Events are filtered by dates from the newest to the oldest by default
Filtering events by dates is performed automatically by the user
Social sharing is provided by the Cordova existing solution (the user can share an event
through VK and Facebook social networks)
The event can be added by the user to the calendar on his/her mobile device
The event location is displayed on the map on the event page
Team
The list of all team members and coaches available on the website is displayed on the
Team page
Each person on the Team page is provided by the image, name and position

6. 6
Stats
Stats page is provided
Selfie Composer
Filter can be applied to the photo
Bulldogs logo, icons and text can be added to the photo
The edited photo can be shared via all the sharing apps and APIs of the device
Push notifications
Push notifications are provided by Ionic push notification service
Push notifications are sent when New events or New blog posts are created
Multilinguality
The application is translated to English and Ukrainian languages
The application uses the mobile device’s language
English is default if the device uses the language not provided by the app
i18n and l10n - AngularJS internationalization and localization services are used to
translate application labels

7. 7
TESTING & BUGFIX The Bulldogs website and application are already
thoroughly tested. Every page on the website was tested
on the most commonly used browsers: Chrome, Firefox,
IE 9, 10, 11, Safari and different screen resolutions.
Special attention was paid to 1366x768 screen
resolution, as it’s considered to be the most popular and
widely used.
The QA team tested the application on two Android and
two iOS devices due to a big number of APIs engaged.
The bug tracking process was much simplified, since the
app was planned to be available only in portrait mode.
The Mobilunity team continues the maintenance of both
website and mobile application after their release and is
sure to eliminate all the defects which might occur.

8. 8
CHALLENGES & SOLUTIONS
Throughout the website and app development there immerged a few difficulties which were
fully tackled by the Mobilunity development team. These problems were either connected
with the compatibility of the WordPress themes and plugins or with finding the way to get
access to device-specific hardware and software, given that the app is hybrid:
1. Localization
To translate content into English and maintain it, we used qTranslate X WordPress plugin.
Unfortunately, after a few updates it turned out that this plugin was no longer compatible
with the WordPress Sporting Club & Centre Theme we used in the Bulldogs website design.
That is why, the team had to switch to the WPML WordPress plugin to ensure successful
multilingual content management and maintenance.
2. Social sharing
Another problem was connected with social network integration, as VK plugin for social
sharing was not provided. So we made use of the Cordova plugin which enables the user to
share content via the native sharing widget of the device.
3. Usage of device features
As the app is hybrid, there were hardships using the native features of mobile devices. First,
the client wanted the users to have the ability to add the upcoming Bulldogs’ events into the
task-/time-management systems or calendar on the mobile device. There was also an
attempt to build a photo editor with sharing ability into the application, therefore access to
the camera, e-mail services and social networks was needed. The corresponding APIs were
built to enable interaction of the Bulldogs app with the other applications on the device and
give it access to native device capabilities, such as the camera.
4. Content integration
The major challenge was to synchronize the app with the website as we wanted the content
of the application to be automatically updated in case any changes or updates are made in
the website’s database. With the help of Node.js server-side platform and its API framework
ActionHero, a REST API was coded by our team of developers to deal with this challenge.
mobilunity.com sales@mobilunity.com
Mobilunity is ready to build budget-friendly websites and highly compatible
mobile applications specially built for your business!