PHP Website for Media 'runverse' – News & Info about Running Events

Client Brief

The client wanted us to design and develop a website that will allow users to find about upcoming races that is going to happen in a nearby location. Locations will be fetched from IpToLocation database and he also wanted to have a dropdown menu to view and choose a location.

Our Endeavor

RunVerse connects runners to races. It offers all the required info about a race to be happened in a given location. The website is offering various details like start time, price, distance, date etc. Users can chose a race from the given dropdown menu to know all the details about a race that is going to happen in a given area in a given specific time.

The client provided us the layered PSDs of the home page and an inside page template and we have converted them into HTML and have integrated hem in the WordPress theme. We have also designed the database structure and have integrated Google Analytics in the same. Payment gateway integration, zipcode database integration and integrating IpToLocation are among few other endeavors we have taken on the designing front.

Frontend

Homepage -

The website displays a list of the top 5 featured races ordered by soonest then closest on the homepage. If there is no featured race available on the database, it would display the soonest races closest to their location.

1. The list displays the logo, name, date and time of the race

2. The “featured races near you” box displays a link that would allow users to see more featured races near their area.

3. When a user clicks on any of the featured races, it would redirect users to that race’s page.

4. Users would be able to view latest WordPress blog post to the RunVerse blog.

Race Search Page

In order to help users to search for a race, they would be asked to provide details like type of race they are searching for and location of where they would like to complete the race. Location can be city, state or zip code.

1. Users would be able to select from a dropdown menu the type of race that they are searching for. Dropdown list items include - Walk, 5k race (3.1 miles), 5 mile race, 10k race (6.2 miles), 10 mile/15k race, Half Marathon (13.1 miles), Full Marathon (26.2 miles) and other distance.

2. Users would be able to input their city & state or zip code and would be able to view the search results within a 25 mile radius of the entered location.

3. The search box would accept a user’s zip code (9 numerical digits) or city and state.

Featured Races Near You Page:

When a user connects to the site, it would pull their IP address and determine their approximate location. Based on their local locations, the site generates a list of featured races that are available within a 25 mile radius of that location.

1. The website displays a list of the top 5 featured races ordered by soonest then closest on the homepage.

2. The “featured races near you” box is also having a link that would allow users to see more featured races near their area.

3. Upon clicking on any of the featured races it would redirect users to that race’s page.

Search Results:

The website serves the users with search results enabling the users to view the races that are found after providing the distance and location. The page would list out the races on the left hand side along with a map on the right hand side displaying the races as points on a map.

1. Users would be able to click on any of the races to see more detail and sort by distance/date. Users would also be able to change their search criteria by distance, location or both to refine the results.

2. The results would display the top 10 results by default; navigation at the bottom of the page would allow users to click on the additional pages to see the rest of the race results.

3. The integrated Google map is there to show all of the races found as points on the map. Each race would have a corresponding icon on the map that would be displayed alongside of the list results on the left hand side.

4. Upon hovering over a point on the map the corresponding race on the left side would be highlighted helping the users to find the point with ease

User & Race Information Page:

1. Users would be able to view the races that they have added to the site, change their personal information and add a new race listing.

2. Users would be able to view their races that are currently displayed on the site or that have been saved to be published.

3. The race listings display the name, date and time of the race, race logo, featured/non featured, active/closed and a publish button if it is saved.

4. The race registration feature would compose of 4 steps (and pages) to register a race for the site. Navigation would appear on the left side of each of the 4 pages highlighting to the user which step of the process they are on.

Featured Race:

This page would allow users to pay to have their race featured on the race results page. Featured race would cost $19/month while the race is active and would end payment on the race date. This is an optional step; users can choose not to make their race featured.

1. The page would show the benefits of featuring the race, images added by the admin.

2. There would be a PayPal box on this page which would allow users to be re-directed to the PayPal site to enter their payment information. Once this payment info has been processed by PayPal the race would be marked as featured and the page would move onto the confirm page.

3. Users would be charged starting the day that the race is registered and that same date each month going forward. When it gets to be less than 1 month to the race the user would be charged the number of days remaining at a rate of $0.63/day.

4. A user would be able to click a button on the page to skip the featured race page and continue with the registration as a standard race.

5. If a user would like to un-feature a race, they would have to click on edit info, click on the featured race section and click edit. From there the user would be able to uncheck featured race. Billing would stop immediately. We are assuming that no refund would be done in the website.

ADMIN PANEL

User Administration: Admin would be able to see a listing of all registered users for the site in list form. Admin would be able to create a new user account from this page. Beside each name there would be buttons for the following:

Race Administration: Admin would be able to see a listing of all races that are currently listed on the site.

1. All races would need to be reviewed and approve before being posted publically.

2. All races would be listed that are awaiting approval.

3. Admin would be able to click each race and view all of the details.

Un-publish race: This would set the race back into saved form, removing it from being seen to public users but still visible to the user who submitted the race.

Edit information: This page would allow the admin to go in and edit any aspect of the race’s information. Confirm and finish page would display the updated information before posting live to the site

Delete: This would allow the admin to delete the race permanently.

Featured: This button would allow the admin to make a race featured or un-feature a race. Admin would be able to make a race featured without going through the payment process.

Charges: The admin would be able to see the charges that have been charged on featured races.

Ads: Administrator would be able to change the ads that are served up on the race pages and the results page

Other pages: Admin would be able to manage the content of the static informative pages.