Jaffer Haider

October 30, 2009

Brainstorming a Tech company name

Filed under: Web — Tags: , , , — Jaffer Haider @ 5:57 am

Brainstorming a name for a software company that I’m a part of (well, as soon as we sign an LLC with this name). A post on 10 company name types on TechCrunch is useful.

October 24, 2009

Encouraging User contributions online – the Community Activity Awareness pattern

Filed under: Social Web, Web — Tags: , , , , , — Jaffer Haider @ 2:01 am

As part of a homework for a Social Web course, I had to consider factors that research showed had an effect on user contribution on social websites (contribution can be anything from commenting, to rating, to making edits on a wiki page), and link them with popular design patterns used for crafting the user experience for such websites.

We primarily looked at the Yahoo! Design Pattern Library and tried to enhance patterns with more details, rationale for why they work, and more importantly, back our claims with credible references.

I didn’t find an equivalent design pattern in Yahoo’s library for the method of encouraging contribution that I was thinking of. I’ve seen this pattern used a lot on the Internet. I thought it might be good to give it some rigor and analyze why it works, in what situations it would work well, and how can it be improved. Below is the description of the Community Activity Awareness design pattern that I proposed (yes I know, I’m not good with names). The gist of the pattern is “When providing a user with the opportunity to contribute to the website, show information about how other users have responded (positively) to that particular contribution action”.

Pattern name

Community Activity Awareness

Problem statement

People might ignore requests for contributing to a website (any contribution that increases social content on the site, such as rating, ‘liking’, or leaving comments) if they are not given information about the contributions of other members of the community.

Solution sketch

clip_image002

Image 1 Mockup of a particular implementation of the pattern

Use when

Use this pattern when you want to tell the user about the activities and opinions of other members of the community about certain content on the website. This pattern can also be used to show popular trends amongst the community to the user. This pattern should also be used when the website wants to nudge the user into performing a certain action (such as commenting on an article).

Don’t use when

Do not use this pattern when you are looking to collect unbiased information, or the ‘wisdom of crowds’ [4] about a certain topic, since this pattern divulges the opinion of other members of the community to the user before they (the user) have weighed in with their opinion. For example, this pattern should not be used for an online poll, or when ratings are used as votes (in the traditional sense) to select someone or something. The reason for this is the anchoring and adjustment heuristic [1] that we as people are prone to. This heuristic states that people’s estimates are influenced by suggested starting points (or anchors).

Solution statement

When providing a user with the opportunity to contribute to the website, show information about how other users have responded (positively) to that particular contribution action.

Solution description & examples

There are many ways in which information about the actions of other users (relevant to the current action that a user is about to perform) can be communicated. Obviously, it greatly depends on the nature of the action.

If the action is a simple ‘click’ operation (such as ‘vote up’, ‘vote down’, ‘like’), then information about the community’s activity can be provided in the following ways:

· Showing only the number of users who have performed the same action.

· Pointing out certain users (who might be connected to the user in some way; e.g. part of their social network) who performed the same action.

· A mixture of both of the above.

If the action is a little more demanding, such as writing a comment or a review, then information about the community’s activity can be provided in the following ways:

· Showing responses of users who performed the same action.

· Showing the number of users and their responses.

This pattern is nicely demonstrated by Facebook’s ‘like’ feature.

clip_image004

Image 2 Facebook ‘like’ feature (user pointed out)

Image 2 shows the case of when the user is shown that another member of the community liked the content item they are looking at. The action in this case is ‘like’ (the button to perform this action is highlighted), and the information is presented just below the action button.

Another instance of this feature on Facebook is shown in Image 3.

clip_image006

Image 3 Facebook ‘like’ feature (numeric count of users)

This case simply shows the number of people who liked this content, and clicking on the number of people provides the user with more details about each person.

Another common use of this pattern is shown by the commenting system on YouTube, as shown in Image 4.

clip_image008

Image 4 YouTube comments

In this case the user is shown the total number of comments (83) and a paginated list of those comments below. The action to be performed in this case is to leave a comment on the video, and a link to perform this action (‘Sign in to post a Comment’) is shown right next to the information about the community’s response to that action.

A slight variant of this pattern can be seen on the Yahoo! Buzz website. Image 5 shows the widget that displays information on the latest user activity related to the ‘Buzz Up’ action (which is just a fancy name for a ‘vote up’).

clip_image010

Image 5 Yahoo! Buzz updates

The difference in this case is that the actual action (buzzing up content) is not available at the place this information is displayed. The user has to click on the article’s name to see the entire article along with the option to buzz it up. This implementation of Buzz Updates can be improved by making a ‘buzz up’ option visible when the user moves their mouse over a particular article’s section. This would allow the user to instantly perform the action that they’ve been told has been performed by other members of the community.

Another example of this pattern in a different context is shown below in Image 6.

clip_image012

Image 6 Online Forum’s ‘Currently Active Users’ section

This is the ‘Currently Active Users’ section on an online forum, which is located near the bottom of the page. This allows users to see which other members of the community are viewing the particular sub-section of the forum that they are viewing. In this case, the action is the actual viewing of content of a certain section of the forum (and possibly contributing to a discussion). Thus showing this information can have the effect of the user spending more time on a particular section of the forum that has a large number of active users. This is just speculation, and also based on my experience of being affected by this information; the user might think that since there are so many people viewing this section of the forum that there must be active/useful/popular discussions going on, and they would be more likely to look at topics in that part of the forum.

Another different incarnation of this pattern is in the ‘Trending Topics’ widget on Twitter, as shown in Image 7.

clip_image014

Image 7 Twitter Trending Topics

The action in this case is tweeting about a certain topic, and the information provided is what other people are tweeting about. This information is provided relatively close to the place of action (the ‘tweet box’ at the top of the profile page). This use of the pattern is different because information about individual users or the number of users is not given. Instead, the fact that a topic is a trend implies that a lot of people are tweeting about it. Thus it has a similar effect as displaying the number of people tweeting about this topic.

Rationale

Kraut and Resnick discuss their claim that people will be more willing to contribute in an online community if they see that others are also contributing in [2]. Their reasons for this claim are:

· Seeing others’ behavior activates a social proof heuristic, which states that in ambiguous situations, people will rely on the behavior of surrounding people and be influenced by it.

· People usually don’t want to contribute to a lost cause, and seeing others in the community making contributions will give the perception that that piece of content is ‘alive’ and perhaps useful to the group in some way. Related to this is the notion that people mostly don’t want to contribute when no one else is.

· People’s sense of fairness sometimes creates an obligation to contribute when they see that others have done so.

Harper [5] also conducted a study that showed that giving users information about the performance of other users increased their contribution in the short term. In that particular case the number of ratings (at a move site) were tracked, and people who had been emailed a newsletter containing comparisons with other people rated, on average, double the movies than people who’s newsletters didn’t have any comparison information.

References

[1] Tversky, A., & Kahneman, D. (1974). Judgment under uncertainty: Heuristics

and biases. Science, 185, 1124-1130

[2] Kraut, R. E., & Resnick, P. (In press). Encouraging online contributions to online communities. In R. E. Kraut, P. Resnick, S. Kiesler, J. Riedl, Y. Chen & J. Konstan (Eds.), Designing from theory: Using the social sciences as the basis for building online communities.

[3] Cialdini, R. B. (2001). Influence: Science and practice (4rd ed.). New York, NY, US: Allyn and Bacon.

[4] Wikipedia contributors, "The Wisdom of Crowds," Wikipedia, The Free Encyclopedia, http://en.wikipedia.org/w/index.php?title=The_Wisdom_of_Crowds&oldid=315858186 (accessed October 9, 2009).

[5] Harper, F., Li, S., Chen, Y., & Konstan, J. (2007). Social comparisons to motivate contributions to an online community. Lecture Notes In Computer Science, 4744, 148. [OR]

I hope this is useful for you if you’re designing the social features of your site. Recommendations for improvements are welcome!

October 18, 2009

The complete solution for implementing a deep-copy clone() method in ActionScript 3

Filed under: Action Scripnt, Web — Tags: , , — Jaffer Haider @ 9:28 pm

When I started out to write a clone method for a few of my AS3 classes, I looked online and didn’t find any official information about cloning classes from Adobe. There were however a few solutions that were hacked together to provide the same functionality (here and here). These solutions have one big problem though, they don’t work with classes which have non-primitive properties.

My solution mostly builds on top of these solutions but it also provides the ability to clone classes which have properties that are custom class. And it also works with inheritance.

I’ve placed all helper methods in a CloneUtility class for better modularity. We’ll be using these methods in the code examples below.

public class CloneUtility
{
    /**
     * This method registers an alias for a class. This registration is required for writing and reading the
object in AMF format. If the object is not registered, a runtime error will be thrown when the object is written
in preparation for a clone.
     *
     * @param object The object to register.
     * @return void
     */
    public static function registerClass(object:Object) : void {
        var qualifiedClassName : String = getQualifiedClassName(object).replace( "::", "." );
        registerClassAlias(qualifiedClassName, getDefinitionByName(qualifiedClassName) as Class );
    }

    /**
     * This method writes the passed object to a byte array. This method is supposed to be used in the
clone() method of the object that is passed.
     *
     * @param object The object to clone.
     * @return void
     */        
    public static function writeObjectToByteArray(object:Object) : ByteArray {
        var qualifiedClassName : String = getQualifiedClassName(object).replace( "::", "." );
        var bytes : ByteArray = new ByteArray();

        registerClassAlias(qualifiedClassName, getDefinitionByName(qualifiedClassName) as Class );
        bytes.writeObject(object);
        bytes.position = 0;
        return bytes;
    }
}

For an example of how to make your classes cloneable, I’ll go with the example of class A and its subclass B. (B extends A)

This technique of making a deep copy works by writing the object to a bytestream, and then reading it back in as a new object. To facilitate this process, the super class (A) will need to implement the IExternalizable interface, which requires the implementation of two methods:

public function writeExternal(output:IDataOutput):void
public function readExternal(input:IDataInput):void

The parent class would look something like this (explained with inline comments).

public class A implements IExternalizable
{
    private var prop1:String;
    private var prop2:int;
    public function A()
    {
        // we need to register class to be able to write and read it back successfully
        CloneUtility.registerClass(this);
    }
    /**
     * This method is responsible for returning a deep copy of this object.
     *
     * @return the cloned copy of this object
     */
    public function clone():A {
        var bytes : ByteArray = CloneUtility.writeObjectToByteArray(this);
        return bytes.readObject() as A;
    }
    /**
     * All properties of the class must be written to output.
     *
     * @param output The stream to which to write to
     * @return void
     */
    public function writeExternal(output:IDataOutput):void {
        output.writeUTF(prop1);
        output.writeInt(prop2);
    }
    /**
     * All properties of the class must be read from the input, in the same order as they were written out.
     *
     * @param input The stream from which to read from
     * @return void
     */
    public function readExternal(input:IDataInput):void {
        prop1 = input.readUTF();
        prop2 = input.readInt();
    }
}

Note that the writeExternal() and readExternal() methods will be invoked when the clone method is invoked (by the write and read calls).

The sub-class, B, would look something like this.

public class B extends A
{
    private var prop3:uint;
    /**
     * The constructor registers this class to enable it for cloning.
     */
    public function B()
    {
        super();
        // subclasses need to register themselves as well
        CloneUtility.registerClass(this);
    }
    /**
     * This method writes all properties of this object to output.
     *
     * @param output The stream to which to write to
     * @return void
     */
    public override function writeExternal(output:IDataOutput):void {
        super.writeExternal(output);
        output.writeUnsignedInt(prop3);
    }
    /**
     * This method reads all properties of this object from input.
     *
     * @param input The stream from which to read from
     * @return void
     */
    public override function readExternal(input:IDataInput):void {
        super.readExternal(input);
        prop3 = input.readUnsignedInt();
    }
}

Note that the sub-class doesn’t need to override the clone method, just the writeExternal() and readExternal() methods.

So far it’s been pretty simple. The cool thing however is that you can also easily clone classes that have a custom class (which supports cloning) as a property. Below is code of a class C that has a property of type B.

public class C implements IExternalizable
{
    private var customProp:B;
    /**
     * The constructor registers object to enable cloning.
     */
    public function C():void
    {
        CloneUtility.registerClass(this);
    }
    /**
     * Make a deep copy of this object.
     *
     * @return A duplicated object of type C
     */
    public function clone():C
    {       
        var bytes : ByteArray = CloneUtility.writeObjectToByteArray(this);
        return bytes.readObject() as C;
    }
    /**
     * This method writes all properties of this object to output.
     *
     * @param output The stream to which to write to
     * @return void
     */ 
    public function writeExternal(output:IDataOutput):void {
        output.writeObject(customProp);
    }
    /**
     * This method reads all properties of this object from input.
     *
     * @param input The stream from which to read from
     * @return void
     */
    public function readExternal(input:IDataInput):void {
        // note that you should cast as the parent custom class (if there is one)
        customProp = input.readObject() as A;
    }
}

Note that you will use output.writeObject() and input.readObject() for custom classes. These methods will invoke the writeExternal() and readExternal() methods that are implemented by those custom classes.

Let me know if this works for you or if you have any suggestions for improvements!

May 12, 2009

Code Complete 2; The Missing Link in Software Education

Filed under: CMU, Pakistan, Quality, SoftwareEngineering — Tags: , , , — Jaffer Haider @ 2:58 am

CodeComplete2_thumb_3I recently bought a copy of Code Complete 2, one of the many books on software engineering that I’ve been meaning to read for a long time. It focuses on a very small part of what I’ve been studying and practicing at my MSE program; software construction. 

By construction the book means the actual writing of code. It is the central part of software development since the requirements elicitation that precedes it is aimed at finding out what is to be constructed, and the testing phase that follows aims to verify the construction.

After going through the table of contents and skimming some chapters, I was amazed at why I wasn’t taught anything like this in my undergraduate Computer Science degree. In fact, I think one of the reasons why programs such as the MSE program at Carnegie Mellon exist is to fill in the deficiency of sound software engineering skills in CS undergrads. During my undergrad program, even though we had a ‘software engineering’ course, we were still not taught about basic construction techniques such as version control, peer reviews, and managing quality at the code level. I’m pretty sure this is the case for a lot of other programs out there as well.

Perhaps it is due to the fact that software engineering is still a very young field, but there is a huge gap between what is being taught in Computer Science undergraduate courses and what is required out there in the industry. I’m not sure about the statistics on how many undergrads get jobs in the industry right away, but in countries like Pakistan where research is not a priority, I’m willing to bet a majority of CS undergrad students look for jobs in the industry instead of pursuing higher studies and research.

This is exactly why programs need to prepare students for writing industry ready code. Books such as CC2 are vital tools for polishing your skills as a software engineer. I firmly believe that we would have a lot less failed projects and more happy customers if people looking to write code for a living would catch up on their reading first.

May 10, 2009

Windows 7 – Finally a worthy successor to XP

Filed under: Technology — Tags: , , — Jaffer Haider @ 8:35 am

I installed the long awaited RC to Windows 7 last week, finally upgrading from Windows XP. I didn’t particularly loath Vista as most people did, but I never felt the need to upgrade to Vista. But Windows 7 blew me away in the first few minutes of using it. I’m probably not going back to XP ever again.

I installed 7 on my Dell Vostro 1500, and the first thing that amazed me was that it downloaded and installed all the right drivers. And not generic OEM drivers, official vendor drivers that I had had to manually install in Windows XP.

The new taskbar in my opinion is the best of both worlds; the Mac dock and the old taskbar. Pinning applications to the taskbar is really handy, and now I never have to worry about how many windows I’m going to open.

HomeGroups and the ability to share and stream media across Windows 7 machines is something that I’m looking forward to using on a home server setup. The concept of libraries is also very handy, although perhaps a little unintuitive at first.

Performance, especially hibernate and restore times have been vastly improved, especially if you compare with XP.

Microsoft has been working on some really cool stuff lately. Live Mesh, Windows Live Essentials, IE8, MEDV, and now Windows 7. I’m waiting impatiently for their vision of 2019 to come true. :)

March 7, 2009

Evolution of the PC – Where are we headed?

Filed under: Technology, Web — Jaffer Haider @ 11:13 am

I’m reading In Search of Stupidity: Over 20 Years of High-Tech Marketing Disasters these days which talks about some high profile and some not to high profile blunders in the early days of the tech industry. It feels so unreal to read about the early incarnations of the ‘computer’, which supported at most 640KB and were heavy enough to induce back pains.

I remember seeing and touching some of these old dinosaurs, and it’s amazing how fast we’ve progressed. I was wondering what people 20-30 years down the line will think of our Macbook Pros, our Netbooks and our HP Dragons. I wonder how quaint our operating systems and software will look to them.

Even today we can see change happening as the concept of the PC being the sole repository for everything is becoming antiquated as more and more things are getting pushed to the cloud. I’m really impressed by some of Microsoft’s new Live services, particularly Live Mesh. It will be interesting to see what role Windows 7 plays in this transition of everything to the Web and how Windows as an operating system will evolve over the decades.

Exciting times indeed.

Rant ends here. Now I’m going to enjoy spring break!

February 26, 2009

Twitter, here I come!

Filed under: Uncategorized — Tags: — Jaffer Haider @ 9:05 am

Finally started twittering! Follow me @ http://twitter.com/jafferhaider

January 18, 2009

How many Computer Scientists does it take to setup a Home Network between XP and Vista?!

Filed under: Technology — Jaffer Haider @ 3:58 am

So far we’ve tried with two. It only worked once, and then stopped working (the very next day). Both machines can ping each other based on IP, but the network doesn’t get established.

I guess this is yet another testimony to the mistake that was Vista. If anyone out there knows how to setup a home network between an XP and Vista machine, please drop a note.

*sigh*

December 9, 2008

Integrating usability engineering techniques into the software development process

Filed under: CMU, Usability — Jaffer Haider @ 7:10 am

I wrote a paper on this topic for a course. Was a pretty interesting experience. Below is the executive summary. You can download the paper as a PDF as well.

Usability is an important quality attribute that has a great impact on the user experience of a software product. To the user, the interface is the product. Thus it is very important for software teams to ensure high levels of usability in their products for them to be accepted and liked by their end users.

There are a number of hindrances that prevent integration of usability tasks in the development lifecycle. The cultural gap between the fields of human computer interaction and software engineering is perhaps the underlying cause of many issues that arise when engineers are made to use usability techniques. Most teams are not aware the importance of usability, or are of the opinion that regular development staff can build perfectly usable interfaces. Management is sometimes of the view that usability tasks will be costly and time consuming. Education and training of engineers and management is required to overcome these issues, as well as customizing usability techniques so that they are cheap and lightweight, hence easy to adopt.

It is also important to define what the team understands by usability, since it encompasses a large amount of characteristics. Usability goals should be decided and usability characteristics of the system should be documented so that they are testable.

There are a wide variety of usability techniques and methods, each having its own strengths and weaknesses. It is important for teams to be able to make the decision as to which technique is required in a certain condition. This report looks at the different stages in the development lifecycle and which usability techniques are suitable therein. An overall approach to integrating usability techniques and practices into the different development stages of a typical iterative development lifecycle is presented. Planning activities and roles related to these techniques are also discussed. Usability integration with slightly different lifecycles, such as XP and ACDM are also examined.

For easier adoption of usability techniques at an organization level, it is important to introduce easy and cost effective techniques at the grass root level. This results in teams reaping the benefits of usability techniques without expending a lot of budgeted resources. In this regard, studies are looked at that highlight usability techniques that are widely used, cheap and easy.

Usability is an integral part of everything that is engineered, whether it be software or otherwise. With the increasing complexity of software systems, it is even more important to design interfaces that are easy to understand and use. Usability is also not something that can be slapped on at a certain point in time. Hence it is important to ensure that usability tasks are planned and carried out during all phases of the development lifecycle.

November 30, 2008

Trip to Baltimore and DC

Filed under: Life — Jaffer Haider @ 5:52 am

I got to fly to Baltimore during the Thanksgiving break to visit family there. It was a lot of fun. I’m going to save most of the details for picture captions that I’ve uploaded on Facebook (visible to friends only), but some highlights:

  • Had turkey for Thanksgiving!
  • We stayed up till 4am and shopped on Black Friday. I didn’t buy anything though, because I didn’t want to lug back a ton of stuff on the plane with me. There were some really nice deals at BestBuy though.
  • Went to see the sights in Washington DC. The Capitol building and all the monuments/memorials were very impressive. Nothing like I’ve ever seen before. The entire organization of buildings in that area of DC was very impressive. We also went to China Town, which was pretty cool.
  • Went to the Baltimore Harbor, which was pretty nice. Apparently the hill overlooking the harbor was where Francis Scott Key came up with the inspiration for the American national anthem. There’s a big American flag on that hill to mark this fact.
Older Posts »

Blog at WordPress.com.