SPFY: Self Protection For You

Software Photoshop icon
SPFY: Self Protection For You thumbnail

I was provided a Photoshop mockup of what they wanted the site to look like. From there I sliced everything up and hand-coded the site. The client wanted customizable text and rotating images for the banner so I put together a jQuery slide show that'd get it's settings from an XML file.

Here's an example of the XML settings for the banner.
<?xml version="1.0" encoding="utf-8"?>
<root>
  <node>blah</node>
  <imgs locale="header_imgs" duration="8" fadeSpeed="1">
      <image filename="img_01.jpg" text="Are you concerned about the protection of yourself, your family, and your home?" />
      <image filename="img_02.jpg" text="Do you wonder what you can do to avoid being a victim of crime?" />
      <image filename="img_03.jpg" text="Do you know the signs and precursors of a violent attack?" />
      <image filename="img_04.jpg" text="Could you take care of yourself if a natural disaster struck?" />
      <image filename="img_05.jpg" text="Are you thinking about owning a gun for self defense?" />
  </imgs>
</root>

The client also wanted a few other custom features. One, the ability for users to send/post questions in regards to self protection.

SPFY ask a question page

So a system had to be built with some simple base validation for user emails, and to then send those questions to the client. It was basically a copy of the contact system except a section had to be added into the CMS to allow the client to add and answer these user questions.

SPFY admin questions list

The second request was an archive page of all the questions where the user could view a full listing of all asked and answered questions. The caveat to that, was that he also wanted a module that'd be visible on every page that'd display the most recent questions.

SPFY archive page