Fanwards (2011/2012)

cropped-fanwardsn

Fanwards is one of my favourite experiences not just because of the people (that is always the most important part of any job), but because of the amount of things i leaned in several aspects.

Fanwards is an startup. Like in any startup, there is a lot of work to do, and not much people to do it. Even when there is time for nice TDD, and we ruled all the development by the most rigours KanBan strategy,  there was not CI, or CD, just because we did not had even the time for installing and maintaining the required software. (Jenkins server, Puppet server, etc).

The basic idea in Fanwards is to gamify and bring to social networks the loyal plans. You do something for a brand, you earn points, you exchange your points by benefits.

The basic requirements were, great user experience, game rule system applied to social network analysis, social network analysis it self,

At that time (2011), after 9 years working in software, i had already my own way to do the things, and i was not happy, but not really frustrated. I already lead some projects to good ports, i had confidence. I was of the school of ‘generated html/javascript’ for what is to web applications. Used to use scaffolders, sometimes writing them by my self (back in the 2007) to be able to eliminate all that repeated code. Moving to groovy/grails when the technology allowed us to move (you know, stability and reliability). Writing java, php and python code for backend, depending on the projects, using languages like smalltalk and haskell just when during the night, as kind of two lives person, but, sadly, just shamed about the one at day light.

In Fanwards i started to work with a known of mine that became a great friend of mine during that time. The first and only person that made me work closer to my full capability. A real smart person (one of that, that a lot of people think they are, but they are not).

 

Thanks what ever you want to believe in, some of our requirements were:

  1. The application cannot reload at all
  2. The data source endpoints should be reusable by the mobile applications

And since we were all people that believe in good designs (even when we had done awful things in the name of the deadlines), we end up having the need of a ‘heavy client’ application. Something that i was used to do in flex, but, somehow, i never even thought in reproduce in javascript.

A whole reactive model that represents the web client world in the browser side (Then the mobile applications should have other kind of model, related with the needs). Reactive means with real events, and model means objects, for real.

That is how, after some months reinventing the wheel, (just because we, or maybe just me, thought that was something different, without solutions available), we decide to take away my ajax wires (based on an adhoc functional library i did by my self) for backbone, and later, we changed also our event management system by the backbone.js one. And for what is functional approach, we also take away my implementation going for Underscore.js

I need to say a lot of good things about backbone, mainly because it gave me back something javascript and html had stole me long time ago: faith in the client development.

In between this and a great graphic designer i had the best experience in my life about.

During this time, as well, we had time also in backend development. And for me was full of new things, first, the cloud. Google app engine,big table, objectify. A lot of frameworks and technologies that i was not yet used to. Using java without hibernate, a strange mix of spring mvc and the plain and old pal spring, for injections.

But, since that was not enough to make me fear, we choose to develop (after one year of existing java code), all the new things in Scala.

The Scala experience, from the point of view of a java programer, maybe overrated, after all, you can do almost the things in the same structured wat. But, for a repressed functional programmer as me, that looks for fun in the monadic implementation of the collections, Scala was, and is, a window open to a whole brave new world. A world where academics meet industry, a world where i can talk about curryfing and partial application without being watched as a freak. And, as a Smalltalk programmer, a place where i can be free to have more real polymorphism.

I need to say that what i did in Scala for social network analysis hardly can be done at the same time in java. And, even when i cannot be proud of the name i gave (you know, i changed metaphor meanings several times, and in the end there was not name refactor), i am proud about the general design, based in something similar to map and reduce, in a functional way.

 

Our outline in this work was really nice.  You just need to go to one of the pages (embedded in Facebook – here -) or go to the institutional page – here – to see what i talked about the design. Not just the beauty of the system but also how everything there is almost alive, how every action implies something in the visual dynamic.

 

Is sad that i do not have any legible code example to show how easy is the wiring of events and CRUD with backbone.js, the only thing i can suggest you if you want to know is to read the minimised and merged version of our javascript files.

Similar for the Scala server part, i have not permissions nor backups anymore, since i quit because of moving to France.

 

All this amazing experiences, mixed with a great scrum based organisation and with the fact of sharing my work time with one of the smartest persons i know, made

logo-color

one of my most exciting and nice experiences i ever had in my current 11 years of experience in the industry.

The outline of our work, even today keep being outstanding  (Even when the business did not work, as you can infer from the lack of movement).

As any other gamified application, Fanwards has implemented game mechanics and rules.

Game mechanics

That means, to rewards somehow the player (user) because what he does. To make his achievements something epic, and make him be part of something bigger than him self, and, most important, that that thing bigger than him, needs him.

All of we have an hero inside our selves, trying to do what is good, in exchange of the glory.  We all want our selves to be somehow immortals.

That first screenshot it has involved not just a beautiful, responsive and single-page design. It has much more things. It has a software design. Behind that fancy curtains models, objects: the badges, the brand (melee island in this case) our friends with their own punctuation. All of that are objects with the proper relations. And the most important thing is that they have the representation needed by a graphical user interface, obtained and maintained  by the RESTFul based endpoints,  transformed to JSON encoded objects by Scala functional based transformations running at Google App Engine accessing to BigTable structure through Objectify framework.

Missions based on social behaviour

As well, like this previous image shows, we have Missions (in spanish Misiones ). Each of the pills there have a social activity meaning:

Me gusta – I like it. Like a publication of Melee island and you will get points and passion!

Yo opino que… – I think that.. – Write a comment in Melee Island publication, and you will get points and passion!

Miren! – Look!! – Share with your friends a Melee Island publication in order to get, again, points and passion.

Is easy to understand that this have a big impact in the design and architecture of our application. We are talking about monitoring what the people does in relation with a brand’s Facebook page.  That mean social network analysis. And yes, we had processes running each 5 minutes crawling through the social activity of our users. The idea was to not be invasive with the users, but make them adopt a behaviour.

And this is really the last face of the missions, or the actions related with points. We had other iterations that involved analysing the timeline of each user in Facebook and Twitter, every 5 minutes, trying to understand if the comments were positive or negative about the brand. All this things were taken out because the brands were not cool with the idea that any user can make a lot of points quite fast, even with our action-cool-down strategy. So, we decided to keep just the things that add value to the broadcasting channels of the brands.

In order to achieve all this social network analysis we used different technologies, from backend to front end based, all what is needed to do not annoy the user with too much ask for permissions. That lead us to use Facebook Javascript SDK, Twitter4J, and RestFB.

If you know about GAE architecture, you will know that is strictly web, and that there is no ‘process’ that is not a request, and that there is not request that do not gives a timeout after 60 seconds.

I just can say that i am proud of my work in the social network analysis and that it was the hell hard to make it fast enough, and to deal with that kind of problems.

 

Rewards

The brands didn’t wanted to let users to have too much points because points used to mean rewards. And that is why we had two kind of points for the user: points it self and passion.

The points are a currency inside Fanwards world. You cannot change them by money, but yes by brand offered prices.  Each price here is an object! Is an object that is inside a collection of prices of the brand!

All this great projection of a domain driven design is possible thanks to the frameworks we had rely on: Backbone.js, Underscore.js, Mustache for templating, JQuery to glue the things needed be glued, and our own set of functional-approach functions that where not provided by underscore.js (such as real curryfication).

All this is what i worked on Fanwards, but is not all what Fanwards was. Fanwards have also mobile applications: Android, iOS and Blackberry applications.

And of course a lot of Startup hard work

Advertisements
Standard

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s