1
apr '11

Log Your Dwight Schrute Fitness Activities!

Inspired by one of our favorite shows, the Office, FriendFit will soon let you log Dwight Schrute's favorite funtivities! Choose from an eclectic selection of Eastern Pennsylvania workouts including:

Planting Beets
Grab your seed packet and shovel. Grow some delicious beets!
Table Making
Watch a table-making demonstration, then grab your tools.
Horse Hunt
It's in the name!
Goju Ryu Karate
From purple to black belts, all are welcome.
Fights to the Death
At least one of the participants will log this activity.
Other activities
Shunning, Paintball, Bat Trapping, Manure Distribution, Forming Alliances, Birthday Decorating, Sitting at Mega-Desk, Notarizing, and Beet Wine-making

Look for these soon when you log post a new workouts. Have another activity to suggest? Leave a comment!

23
feb '11

The Magic Behind User Interfaces

“How hard could it be to add a single checkbox to a web page?” Our designer asked me this question as we planned a new feature to let users auto-tweet their activities. You’d think it would be as simple as sprinkling a little HTML, adding a bit of code on the server, and moving on to the next new feature. However, there was so much more to adding this single checkbox that I thought it would be interesting to share how much work a small change really can take.

The Design

First, we had to answer “Where should the checkbox go?” and “How should it look?”. Here’s what we came up with, simple and concise. Writing the HTML took less than a minute.

Now it was time to answer “What happens when the checkbox is clicked?”. We assumed most users would be connecting to their Twitter accounts for the first time, so we focused on this interaction. Here’s a breakdown of how it works:

  • Ask the user for permission to connect with their Twitter account.
  • If they accept, leave the checkbox checked.
  • If they don’t give permission, uncheck the box and show some sort of error message
  • Alternatively, if they had already connected their Twitter account, just leave the checkbox checked.

OAuth and Twitter API

Next, we needed to learn how to authorize a user’s Twitter account. Twitter uses a protocol called OAuth that lets users give publishing permissions to other websites. When you authorize FriendFit, we receive a special token that lets us tweet on your behalf. We need to store this token (a string of letters and numbers) in order to use it later.

This was our first time using OAuth and the Twitter API, and thankfully we found a great PHP library, TwitterOauth, to handle both. Using this library, we created a new pop up page to handle the entire connection process. This page first sends the user to Twitter, then saves the authorization token after the user accepts. To make things even friendlier, we give users the option to add their twitter username to their profile after they’ve connected. In order to store this new data, we needed to add a few new fields to our database.

User Session & Login

Now that we’ve saved the user’s twitter token, we needed to change in the site’s login code. On login to FriendFit, we know needed to check if the user had connected to their Twitter account. To avoid asking the user to verify Twitter again, we added some Javascript to let the page know that the user has already verified their Twitter account.

URL shortening

Now that we have permission to tweet on a user’s behalf, we needed to figure out what were going to tweet. At a minimum, we wanted to share the type of activity, mileage, total time, calories burned, and a link to the new post. Because of Twitter’s 140-character limit per tweet, we now needed a way to create short links to individual posts. You may be already familiar with URL shortening services such as Bit.ly, but we felt that having the FriendFit brand in the URL was important. So we added a simple redirection page to handle these new links, making the appropriate change to apache’s .htaccess file. The new links look like this http://friendfit.com/a/lhj, and the Apache redirection rule is as follows:

RewriteEngine On
RewriteRule ^a/([^/]+)*$ /shorturlhandler.php?request=$1 [NC,L]

Actually Tweeting

At this point, we have both the permission to tweet and the tweet content. What’s left is actually publishing the new tweet! This required a few changes to our “FitBlog_saveNewPost()” function, both to accept a flag indicating the user’s desire to tweet, as well as actually sending it to Twitter. Since we use AJAX to save new posts, this required changes on both the server-side and client-side code. After much testing, everything worked seamlessly.

Conclusion

So now you know that often a checkbox is so much more than just a checkbox. Here’s a diagram I’ve seen a few times that neatly summarizes this point (sorry, I can’t seem to find the original source!). We, as programmers, must always look for ways to simplify the user experience and hide complexity from our users. This is the point where interfaces start to feel like “magic”.

So, what was your biggest implementation challenge for a so-called “small change”? Please share in the comments below.

15
feb '11

New FriendFit Facebook App Released

We’re very happy to announce the new FriendFit Facebook application. Now you can log activities, draw routes, and send motivation without leaving Facebook or having to log in. In fact, we’ve made it easier for your friends to motivate you! Each time you share an activity on Facebook, your friends have a chance to post some motivation on your wall. Here’s a screenshot of the app’s homescreen:

New and existing users can use FriendFit from the Facebook app, on the FriendFit.com site, or both! All of your data, including logged activities and routes will show up in both places. Privacy controls are applied consistently to both. Try the new FriendFit Facebook app now and leave us some feedback so we can improve.

Other updates

We also took an opportunity to freshen up the FriendFit site in a few places. Fitness blog navigation is now a bit cleaner and compact, especially when the monthly or weekly summary is displayed (see below). There’s still room for improvement, but we feel that this is a step towards simplicity.

Also, user profiles now show a more useful activity summary. This lets you quickly see what sports and fitness activities someone enjoys, and also gives you more info about each sport. Now you can see the total number of posts, total mileage, and total time for each kind of activity.

18
aug '10

Ask the Doc: 3 Ways to Get More Daily Exercise

Dr. Hochberg Introducing a series of posts written by a real doctor who's here to answer your questions about fitness, health, and everything in between.
Please send your questions to: askthedoc@friendfit.com

With the modern means of transportation, communication, and work we find ourselves less and less active compared to our ancestors. They would walk, ride a horse, work all day on the farm or in a factory performing manual labor. Today's cars, TVs, iPhones, computers, even Facebook all work together to nudge us towards an unhealthy level of inactivity.

People that sit for more than 23 hours a week, which is just about anyone with a desk job, have higher chances of getting heart disease. Besides scheduling in some time at the gym, here are three ways you can add exercise to your regular day:

  1. Park farther away. When you park your car at work, the mall, and at the grocery store, park far away from the entrance. You'll not only get some shopping done, but you'll get some extra walking distance. It was observed that factory workers who parked their cars far from the entrance of the building worked better and felt healthier.
  2. Lift weights during the commercials. Leave some weights next to your couch or easy chair. While you watch your favorite shows, use the commercial break to do some curls or leg lifts.
  3. Take the stairs. Instead of using the elevator to go up one floor, use the stairs. For every ten steps up, you burn approx. 10 calories. Going down 10 steps sheds 5 calories. Let's say each day you burn an extra 30 calories taking the stairs. In one week you'll burn 210 calories, and 10,680 in one year. That means you can burn 3 pounds of fat (~3,500 Calories) each year by just taking the stairs. Not only will you feel better and contribute to your weight loss, but next time you feel like eating a donut you might think twice about how many steps it will take to burn it off.
26
jul '10

Update: Weekly and Monthly Fitness Stats

We’ve been busy working on the FriendFit iPhone app, but there were a few web updates that were just asking to happen.

Weekly & Monthly Fitness Blog Stats

Many of you have asked for monthly and weekly stats, and we listened! You can now view fitness blogs in one of three views: Weekly, Monthly, and All (which just shows the last 10 posts). View a summary showing the total number of posts, mileage, time, and calories burned for that week or month. You can use the arrows to move backwards and forwards in time. Just click the selected view in the menu below the green Fitness Blog tab. View your fitness blog now!

Track Effort & Motivation

We also worked to simplify the “Log a new activity” page and decided that it was finally time for the couch potato to retire. In its place, we now have color-coded dots to quickly keep track of how you felt during your activity. On the fitness blog post, you can see a single dot in the color chosen.

Sorted Route Lists

Our last update gave you the ability to rename routes, and now you can sort your route list by one of 3 options: date created, name, and distance. Just visit your route list and see for yourself.

That’s all for now! We’ll post some iPhone app screenshots soon.

1
jul '10

Update: New activities and Facebook auto-posting

We’ve just released another quick update to the site!

New Fitness Activities!

We’ve added 13 new fitness activities (and one new category), including:

  • Land Activities: Horseback Riding, Camping, Frisbee
  • Water Activities: Kayaking, Canoeing
  • Gym & Studio: Boxing, Gym Workout (for recording trips to the gym)
  • Racket Sports: Ping Pong (aka Table Tennis), Squash, Racquetball
  • Team Sports: Kickball, Field Hockey, Rugby, Ultimate Frisbee

Automatic Facebook posting

After encountering some issues with our last release, we’ve now added automatic posting to Facebook when you post a new activity. You can choose which posts go to Facebook by checking or un-checking the “Share on Facebook” checkbox on the new activity page.

As always, please contact us if you run into any issues.