Omid Foundations

(UI Design, Improvement, & Development)

Omid-e Mehr is an amazing program empowering troubled young women in Iran. You can learn more about them in their program breakdown or by watching the documentary. The objectives of the program resonated with me and I began volunteering to do their web work a few years back. Recently I've started conducting tests on the site with an eye toward improving the interface — which is what this page is all about.

A New Homepage

In early 2011 Public Zone donated a new website design to Omid. A few months after the site went live it was determined that the mast area on the homepage needed to be updated. The current mast was taking up a lot of space without focusing on anything important to Omid — users learning about the program, updates to present campaigns, the latest news or how a user could get involved.

Omid's old homepage mast
The original homepage mast

With those objectives in mind I set about designing a new mast.

  • The banner image — the old banner image effectively communicated the state of the girls coming into the program but I felt it would be better to lead with an image of them actually enjoying themselves
  • Highlight multiple areas — the folks at Omid wanted to highlight multiple stories in the mast, so I accounted for it with a four point slider. Normally, I'm not a huge fan of sliders but it seems to be performing well in testing.
  • More stories — instead of featuring just one of the stories developed during the latest campaign I decided to use them all. As more stories are added, this section will expand. Since it has the title "Omid Stories" and photographs of girls with their names I figured an expository blurb was probably unneccesary.
  • Descriptive text — I changed the visual placement of the descriptive text but in the markup it is still before all the other content, as it's essentially an "about us" chunk of content.
  • Easy donation — I have doubts that users will land on the homepage and immediately head to donate. The real funnel to donation runs through one of the stories. That won't stop me from making it as easy as possible for a user to do, though.

The new mast as it appears in production:

Omid's new homepage
The updated mast for the homepage

For the test I set up between the two pages I arbitrarily set the "conversion" to be someone who reaches the donation page after viewing the homepage. That is what is meant by "conversion rate" in the table below. The tests are ongoing but so far the results look like this:

Exit Rate Bounce Rate Conversion Rate
↓ 8% ↓ 20% ↑ 50%

A Faster Donation Page

Omid's donation page

Formerly, the donation page would ask a user which currency they'd like to use for their donation before ferrying them along to the appropriate page. When I looked at the data I discovered that only a fraction of visitors would go on to select a currency that wouldn't be predicted by their location.

So, I reduced the steps to donation by one. The donation page now roughly determines a user's country via IP and plops them onto the corresponding page. Exit rates from this part of the funnel have fallen but until we switch to something other than PayPal I don't see a huge revolution in the amount of money being donated happening.

Exit Rate
↓ 16%