CASE STUDY : – a social network

5 September 2012 Comments Off

In the recent years, the Social Networks revolution changed the way we gather, interact and exchange information, and the online Communities thrive, bringing new value to organizations and products. We all know models of success, and we all use frequently at least several social networks.

Yet, each community is different, each organization has its specific, which derives from the special nature of the needs and opportunities that its members seek to be fulfilled.

Considering the launch of a new Social Network, it is imperative to find innovative ways to bring additional value for its members to be, because the members have to be attracted to the new community, they have to be engaged, encouraged to interact and to stay active permanently. The challenges are conceptual (find new, better ways to fit the needs of the requirements of the members), but also technical (incorporate the newest technical trends, find the most performant technical solutions). Bellow you will find the story of this endeavour, from our perspective, as web agency.

Main requirements

  • 1. Create a web platform which can be scaled when needed
  • 2. Define the architecture of a web application which allows the user to manage a lot of content types: profiles, contacts, albums, images, videos, documents, blog posts, comments, messages on the wall, personal messages, etc.
  • 3. Permanently improve the user experience on the site
  • 4. Simplify the functionality as much as possible to be easier to use

Technical challenges and solutions

  • 1. The application is implemented using Zend Framework
  • 2. Different uploads
    • – to allow the user to upload more video types all the videos were converted to flv in background and displayed them using a flash player
    • - multiple image upload using flash
    • - “on the fly” image upload
  • 3. The privileges management for the content elements and profiles
    We had to figure out a system which allows the user to share the same content element on more profiles and to share his/her profile with other users. When a profile is been shared, all the content elements present in that profile have to be shared as well with the owner of the second profile. The user has the possibility to change the shared profile with another user any time he/she wants by dragging the user from one profile column and dropping to another. The operations regarding the granting/revoking of privileges are handled in the background.
  • 4. Infinite scroll for all the available contents: wall messages, images from albums, albums list, blog posts
  • 5. Profile image upload and crop
    The user can upload the profile image using the so called “on the fly” image upload and then he/she will be able to position the image in the square as he/she wishes and can crop the desire parts of the picture using the pre-defined crop zones by drag & drop.
    Upon save three kinds of images will be cropped:

    • - one for the profile’s header
    • – one for the Home page
    • – one for the image that will be displayed on: comments, wall messages, search results

    We use ImageMagick for all the image operations: resize, crop, rotate.

  • 6. Search
    The main search combines the site’s contacts (public profiles) with a Facebook search (using Facebook Api), having the posibility to invite the Facebook contacts to the IdentityZ website.
  • 7. Drag & drop
    One of the biggest challenge regarding the user interface was the drag & drop functionality. In order to improve the user experience on the site, drag & drop is introduced on different elements: pictures, contacts, files, mails.

    • – the user can drag & drop attachments to the messages sent to other users
    • – the user can choose which identity is showed to another user from his/her contacts, this can be done using drag & drop to change the column where the contact is displayed
    • – the cover of a blog post can be set by drag & dropping the desired image
    • – mails and files and contacts can be moved to another profile by switching profile columns

    See the images for examples.

  • 8. Facebook and Twitter profiles
    These profile types will ask the user to provide the Facebook / Twitter account info and in order to retrieve all the contacts to the IdentityZ profile. After the profile activation the profile’s owner will be able to publish messages on the Facebook wall / Twitter directly from the IdentityZ account.
  • 9. Wall & news
    The wall contains all the messages generated by the system when another user takes and action to that profile: comment on blog post, comment an image, tag a picture, create an album, create a blog post and so on.
    The news collect all the messages generated for the logged in user and his/her contacts.

There are many more interesting features of the system, which are available at And stay tuned, more will come, to enhance even further the experience of the users.

The challenging nature of the user interface and the high level of complexity behind this social network infused us a dose of deadline related panic, but, at the same time, creating the site was a lot of fun and indeed an interesting job.

A social network system is always an opportunity to try new concepts and strive to meet up with the latest trends. An active system of this nature is always evolving and transforming, not just through the contribution of its community, but also with new concepts, new functionality and continuous improvements in the usability and performance of the features. Our aim is to actively continue to deliver the best solutions to the system, and apply the lessons that we have learned in order to bring extra value to our customers, in all the projects that we make.

This article can't be comment.