Tumblelog by Soup.io
Newer posts are loading.
You are at the newest post.
Click here to check if anything new just came in.

December 07 2011

15:20

SocMap.com's Location-Based Data Maps Becoming Real

SocMap.com is pleased to announce that we've launched the "tweets" and "places" features on our site, and we hope to debut "local initiatives," "local questions," and a city-planning game on February 1st.

SocMap, a 2010 Knight News Challenge winner, is building a map-based interface for location-related data such as tweets, local initiatives, local news, public hearings, city-planning games, etc. We want to turn a city into a neighborhood, a place where everybody can see and hear their friends, communicate with each other, and get involved based on their geographical location. The project was started on Jan. 1, 2011.

Here's an overview of some of the progress we've made while beta-testing the site:

How we approached the Landing Page

The landing page is mainly responsible for attracting new users. Here's what the evolution of the SocMap landing page looks like.

socmap1.png Click here to expand image

First Landing Page

  • % of visitors registered to SocMap.com: 5.4%
  • Total attracted users: 46
  • Total users during given period: 46
  • Number of new visitors during given period: 852
  • Total unique visitors: 852
  • Period active: Aug. 1 - Sept. 1 (4 weeks)

Upon being opened, the map was centered roughly on where the user was located. The authorization button was situated on the top left, which took users to the Twitter login window.

This login button was small, hard to notice, and didn't communicate visitors' need to log in, so it achieved a poor conversion rate -- only 5.4 percent. Additionally, if a visitor was attempting to add content to SocMap, no suggestions of "Please Log In" were displayed, which left many users confused about the site's functionality and made them leave.

This is how the site looked right after Login function was implemented. This version was not made public and mainly served development purposes and testing by a limited number of experts. During this phase, the site was mainly visited by members of the development team.

socmap2.png Click here to expand image

Second Landing Page

  • % of visitors registered to SocMap.com: 7.7%
  • Total attracted users: 95
  • Total users during given period: 141
  • Number of new visitors during given period: 1,033
  • Total unique visitors: 1,224
  • Period active: Sept. 2 - Oct. 5 (4 weeks)

The map was centered on the user's location according to his or her IP address. Upon entering the site, a welcome window asking the user to log in appeared and displayed a description of key features to motivate visitors to actually press the "Sign in with Twitter" button. In contrast to the first version, the "feed" tab on the left was hidden, though it could still be opened if desired. By opening the feed tab, still unregistered users were shown the login button and SocMap content sorted chronologically. No content was displayed on the map.

Text in the welcome window was too long and not compelling enough, and the window itself was at odds with the overall style of the site. Despite this, however, the highlighted "Sign in with Twitter" button achieved a slight rise in conversion rates (over 2.3 percent), reaching 7.7 percent.

This was our first attempt at making visitors register. Their attention was immediately directed to the login button. Unfortunately, an empty map and this type of window didn't engage users or stimulate them to register, since it was not made clear what the site is about and how easy it is to register. We were forced to rethink the landing page to make it more attractive and socially engaging.

socmap3.png Click here to expand image

Third Landing Page

  • % of visitors registered to SocMap.com: 11.2%
  • Total attracted users: 32
  • Total users during given period: 173
  • Number of new visitors during given period: 286
  • Total unique visitors: 428
  • Period active: Oct. 6 - Oct. 19 (2 weeks)

The "feed" tab was completely hidden, prompting visitors to do just one thing: log in with Twitter. Also, a subtle "follow @SocMap" option was added to allow for feedback and to let users know we care about them as individuals. The Twitter button was supported by an engaging question that could be answered by logging into SocMap.

This type of approach turned out to overshadow what's important about SocMap -- the map, which, if empty, doesn't invoke any associations in the user. The Twitter button took up the major portion of the landing page's conversion potential, but didn't really tell the user why logging in might be a good idea -- it just looked like a Twitter ad. This type of landing page raised the conversion rate by 3.5 percent (a 50 percent increase), giving us confidence that we were on the right path. Some browsers had trouble opening this version, but the quirks were worked out, and we proceeded to bring some life to the landing page idea.

socmap4.png Click here to expand image

Fourth Landing Page

  • % of visitors registered to SocMap.com: 12.9%
  • Total attracted users: 50
  • Total users during given period: 223
  • Number of new visitors during given period: 386
  • Total unique visitors: 507
  • Period active: Oct. 20 - Nov. 15 (3 weeks) and onwards

On this landing page, the pronounced, blue "Come in" button served the purpose of logging users in. Parallel to it, we enlivened the map interface, and the content creation tab became present from the start. Activities on the map moved the welcome message to the side to allow for better visibility. Users were prompted to log in upon attempting content creation.

This landing page achieved a conversion rate of 12.9 percent and met our expectations.

While the efficiency of the landing page is steadily increasing, lack of new content creation is a cause for concern and has led us to think that perhaps users are given the impression that SocMap provides ready content and doesn't require user participation. From now on, we'll pay greater attention not only to the conversion rate, but also to content creation rates.

Not enough activity per registered users

Presently, 224 users have made 403 entries, which would be fine, if most of the entries weren't created by the developers. Our next goal is for everyone to contribute content.

The functionalities for comments, posts and retweets on the map interface are already there. A few days ago, a notification function that alerts users to activity near them was added as well. But the problem remains: Users don't create content. Reasons for that might be the copy on the landing page, as well as users perhaps not being sure what to write, who will see it, and what will happen to their message. Maybe we've made a mistake in thinking users would be comfortable creating messages on a map.

This is why we'll try a new approach -- perhaps users will use the map interface to get information they need. To do this, we'll create a Q&A feature that will allow users to learn what they need with the social search method. It will work like this: Users will be able to ask their Twitter and Facebook friends about their neighborhood -- e.g., "Where is the most romantic spot in Boston?", "Where are the best burgers in NY?", "Which parks in Chicago need cleaning up?", "Where's a good place to watch today's NHL game and drink some beer?", "Where are we partying tonight?"

We came to this conclusion after studying Twitter content. We'll experiment with the ability to ask questions and get answers in hopes of sparking a geographically significant discussion. Naturally, all communication will have a geographic reference.

Hopefully, this will start online discussions with a reference to physical space. We'll see!

Twitter limiting our user base

Even though the conversion rate for new users is high, we strive to increase it even more, especially by implementing a login option with Facebook accounts. It would both increase conversion rates and open SocMap for a far broader user spectrum. Some of the most interested parties (municipalities, government institutions, urbanists, architects) don't use Twitter as much as Facebook.

Opening SocMap up to Facebook accounts could attract these types of users and create a base of quality content.

November 04 2010

14:10

A Six-Step Process for Managing Web Projects

After years of intensive work in the IT industry, I've put together a practical guide to project development that my company uses for 99 percent of our projects. So far we've done amazingly well with this approach. Once you know it, it feels so simple and natural that you don't even know you know it. In the interest of helping other folks with their development projects -- and to encourage you to offer your tips and suggestions in the comments -- I offer our process.

Step One: Consultations

This is where you start brainstorming about the core idea, as well as any potential solutions and technologies. Capture all of the the ideas, solutions, and any relevant prices etc. You can only proceed with the next step when you feel ready to talk about specific functionality, prices and timelines.

Step Two: Planning

Make a list of all the features and functions you can imagine for this project. Then start estimating how much money and time it requires for each. Now go through your list and prioritize the functions to determine which need to be launched right away, and which are less important and can wait for a future update. Now you can begin to see how much time and money you need to build architecture, interface, design and do the bug-fixing and configuration. Move to the next step once you've established the development timeline and resolved that with the available budget.

Step Three: Wireframe

Take a blank piece of blank paper and sketch the basic structure of a website or application, and the relationships between its pages or sections. Draw your menus and the main elements. Go into as much detail as you consider important, but know that you don't have to plan through each and every element or establish every detail about how things will work and look.

Step Four: Interface

Using your wireframe as a guide, draw everything that has to appear in the final product, including everything that needs to be there. Figure out all the links, all the menus and interface methods, such as pop-up, drop-down, slider etc. You can still do this on a blank piece of paper, but I suggest to using software such as yED, which is a free download. Take your time with this stage. When you have it perfect, set it aside for at least one day and then examine it with fresh eyes. Try to find at least two places where you can save a click, make a more intuitive menu, or make something else better. Then print it out and you're ready to go with the next step.

Step Five: Design

If you haven't already begun working with him/her, begin meeting with your designer(s). Present wireframe sketches and the interface. Explain the tricky spots, explain why things are there as they are, and how your ideas have evolved. Now it's time to let them get to work.

Step Six: Programming

You should provide three things to your development team: the list of functionality, the interface outline, and the design. Now they work to make it all real.

Obviously, a lot more happens in the development and testing stage, and in future posts I'll share more advice and lessons about that and more. For now, share your thoughts and process int the comments.

14:10

A Six-Step Process for Managing and Developing Web/IT Projects

After years of intensive work in the IT industry, I've put together a practical guide to project development that my company uses for 99 percent of our projects. So far we've done amazingly well with this approach. Once you know it, it feels so simple and natural that you don't even know you know it. In the interest of helping other folks with their development projects -- and to encourage you to offer your tips and suggestions in the comments -- I offer our process.

Step One: Consultations

This is where you start brainstorming about the core idea, as well as any potential solutions and technologies. Capture all of the the ideas, solutions, and any relevant prices etc. You can only proceed with the next step when you feel ready to talk about specific functionality, prices and timelines.

Step Two: Planning

Make a list of all the features and functions you can imagine for this project. Then start estimating how much money and time it requires for each. Now go through your list and prioritize the functions to determine which need to be launched right away, and which are less important and can wait for a future update. Now you can begin to see how much time and money you need to build architecture, interface, design and do the bug-fixing and configuration. Move to the next step once you've established the development timeline and resolved that with the available budget.

Step Three: Wireframe

Take a blank piece of blank paper and sketch the basic structure of a website or application, and the relationships between its pages or sections. Draw your menus and the main elements. Go into as much detail as you consider important, but know that you don't have to plan through each and every element or establish every detail about how things will work and look.

Step Four: Interface

Using your wireframe as a guide, draw everything that has to appear in the final product, including everything that needs to be there. Figure out all the links, all the menus and interface methods, such as pop-up, drop-down, slider etc. You can still do this on a blank piece of paper, but I suggest to using software such as yED, which is a free download. Take your time with this stage. When you have it perfect, set it aside for at least one day and then examine it with fresh eyes. Try to find at least two places where you can save a click, make a more intuitive menu, or make something else better. Then print it out and you're ready to go with the next step.

Step Five: Design

If you haven't already begun working with him/her, begin meeting with your designer(s). Present wireframe sketches and the interface. Explain the tricky spots, explain why things are there as they are, and how your ideas have evolved. Now it's time to let them get to work.

Step Six: Programming

You should provide three things to your development team: the list of functionality, the interface outline, and the design. Now they work to make it all real.

Obviously, a lot more happens in the development and testing stage, and in future posts I'll share more advice and lessons about that and more. For now, share your thoughts and process int the comments.

August 16 2010

18:43

GoMap Helps Communities Map Local Events, News

GoMap is a map-based interface for local news, initiatives, building projects, public hearings and tweets. Our project, which won a 2010 Knight News Challenge grant, is ment to turn a city into a neighborhood, a place where everybody sees and hears his/her friends, can communicate with each other, and have fun based on their geographical location. Here's how the project was described by the Knight Foundation:

To inspire people to get involved in their community, this project will create a live, online map with local news and activities. GoMap Riga will pull some content from the web and place it automatically on the map. Residents also will be able to add their own news, pictures and videos while also discussing what is happening around them. GoMap Riga will be integrated with the major existing social networks and allow civic participation through mobile technology. The project will be tested in Riga, Latvia, and ultimately be applicable in other cities.

You can also watch a video about GoMap:

Knight News Challenge: GoMap Riga from Knight Foundation on Vimeo.

Below is a piece-by-piece overview of the elements that will be incorporated into the project.

Project Elements

News -- GoMap will automatically read news from online sources and place them on the map. GoMap will notify people about the news related to their home or interest area, so that people won't miss it when something is going on in their local community.

Initiatives-- Issues like "this fountain needs to get fixed" or "let's have an artist wall here" could take place on the city map. People could also create initiatives on the map, gather signatures from fellow citizens, and bring the initiative to the attention of the local municipality, media, police, etc. in order to get things done.

Building projects-- GoMap will automatically place all the local building projects on the map, notify locals about them, and in effect host an online public hearing about these projects.

Twitter -- Tweets like "check out this bar" or "let's meet right here" will be incorporated into GoMap. With just two clicks, people can have their tweets placed on the map.

We're currently in the very early stages of development and you can keep an eye on our progress at http://gomapdev.appspot.com. Our key challenge is to master the Google Maps API and create a lot of new code in order to get things to work and look the way we need.

Let us know what you think about our project, and thanks for reading!

18:43

GoMap Helps Communities Map Local Events, News

GoMap is a map-based interface for local news, initiatives, building projects, public hearings and tweets. Our project, which won a 2010 Knight News Challenge grant, is ment to turn a city into a neighborhood, a place where everybody sees and hears his/her friends, can communicate with each other, and have fun based on their geographical location. Here's how the project was described by the Knight Foundation:

To inspire people to get involved in their community, this project will create a live, online map with local news and activities. GoMap Riga will pull some content from the web and place it automatically on the map. Residents also will be able to add their own news, pictures and videos while also discussing what is happening around them. GoMap Riga will be integrated with the major existing social networks and allow civic participation through mobile technology. The project will be tested in Riga, Latvia, and ultimately be applicable in other cities.

You can also watch a video about GoMap:

Knight News Challenge: GoMap Riga from Knight Foundation on Vimeo.

Below is a piece-by-piece overview of the elements that will be incorporated into the project.

Project Elements

News -- GoMap will automatically read news from online sources and place them on the map. GoMap will notify people about the news related to their home or interest area, so that people won't miss it when something is going on in their local community.

Initiatives-- Issues like "this fountain needs to get fixed" or "let's have an artist wall here" could take place on the city map. People could also create initiatives on the map, gather signatures from fellow citizens, and bring the initiative to the attention of the local municipality, media, police, etc. in order to get things done.

Building projects-- GoMap will automatically place all the local building projects on the map, notify locals about them, and in effect host an online public hearing about these projects.

Twitter -- Tweets like "check out this bar" or "let's meet right here" will be incorporated into GoMap. With just two clicks, people can have their tweets placed on the map.

We're currently in the very early stages of development and you can keep an eye on our progress at http://gomapdev.appspot.com. Our key challenge is to master the Google Maps API and create a lot of new code in order to get things to work and look the way we need.

Let us know what you think about our project, and thanks for reading!

Older posts are this way If this message doesn't go away, click anywhere on the page to continue loading posts.
Could not load more posts
Maybe Soup is currently being updated? I'll try again automatically in a few seconds...
Just a second, loading more posts...
You've reached the end.

Don't be the product, buy the product!

Schweinderl