Work out loud

Less is more rules the market challenge

noreply@blogger.com (Massimo Sgrelli) — Fri, 14 Aug 2009 17:02:00 +0000

Two years ago there were very few people promoting "less is more" as a successful recipe to win the competition. I remember I was really touched when in 2006 met 37signals way of doing things. They were proudly making apps with LESS features!
I thought it was genius and I began doing the same with GotThingsDone.com
A year ago the crisis faced the market and companies - small and big - soon began to look for ways to escape the inervitable troubles.
Now business analysts and market experts tell us that the solution to win in the future is in doing less. So products with less features began to drive this new way of thinking the market: ultra portables laptop from Asus won, for example.

This is our time to make our mark. We trained ourself on the last two years on the weird playground of simplicity, so we can finally succeed.

It's time to rethinking what we have done right now and creating new simply useful things. I'll take this direction

New interesting times are facing in front of us.

Learn new stuff now: Ruby on Rails, Erlang and Objective-C

noreply@blogger.com (Massimo Sgrelli) — Mon, 01 Jun 2009 08:20:00 +0000

During the last few days I have made some considerations about what set of skills an Internet programmer must have nowadays and why they are so different from ten years ago. In 1999 the economy and the Internet revolution were fully showing their positive wave. New technologies, new programming languages were facing on the market, and every young startup addicted was betting his faith in the New Economy phenomenon. All you had to know was HTTP, HTML, one or two programming languages Internet-aware - like Java and PHP - and one database software - like MySql. In those years things were "pretty simple", because they were just born: MVC frameworks were in their infancy, computer power growth was following Moore's law and multi-core buzzword was 5 years away to be introduced on the market, smart phones were only phones and finally, Microsoft browser was actually winning its battle against the rest of the world. From then, a lot of things have changed rapidly, and some of those have made a huge impact on our daily life. Let's have a quick look at what I consider to be the three main facts affecting the big changes that are now part of our life.

First fact. In 2004 a new revolutionary Internet framework named Ruby on Rails was invented by David Heinemeier Hansson, and that definitely changed once and for all the way we develop web applications. I have been involved in many enterprise MVC framework designs for more then ten years, and Rails has been the very first technology that really simplified my work building a complex web application from scratch. Remember: there wouldn't be no Twitter without Rails.

Second fact. Exactly in the same year, in late 2004, semiconductor industry leaders announced that their new high performance microprocessors would henceforth rely on multiple processors or cores. The new industry buzzword multicore was born, and that began to change everything in how we would have designed high performance and highly scalable web applications in the future. Applications would have soon used concurrent processing strategies to address simple and complex issues. This processing power revolution gave a burst to cloud computing and people soon discovered that they needed new tools and new languages to face this challenge. Among the different programming languages useful for this goal, there was one invented by the Swedish telecom company Ericsson in the late 1980s, named Erlang, that perfectly fitted to the emerging concurrent processing needs. This programming language is going to drive the cloud computing revolution for the next few years, and smart companies like WideTag are driving the change. This young company will get huge attention in the next few years.

Third fact. About two years ago, Apple changed everything in the mobile market, launching the iPhone. A new revolutionary device, thought from the beginning to simplify user interaction with the mobile world and with the Internet in general. Apple set new standards in an instant and created a new unique global market devoted to mobile devices. Literally hundreds of thousands of applications have been uploaded to the Apple Store in a few months. For the second time since the Internet was launched, programmers felt that a huge opportunity was ahead of them. Then if you weren't a Mac programmer, in order to approach iPhone application development you needed to learn a completely new language called Objective-C. In the next few years knowing this language and all the other SDK stuff distributed by Apple will be really important, because you won't be able to plan the strategy of your application, without taking into account the iPhone platform.

Yammer, Twitter platform for the enterprise

noreply@blogger.com (Massimo Sgrelli) — Thu, 21 May 2009 15:49:00 +0000

Have you seen Yammer.com?

It's a web application similar to Twitter thought from the beginning to be used in the enterprise. I've decided to give it a chance testing the free version, and to make more real I've invited some of the people that I work with. The real effect doesn't seem to be so viral as I expected could actually be, even if day after day people are beginning to use it. It's a sort of bulletin board system, where every new person invited to the club will probably add new colleagues to the community.

Thinking about the potential of the platform, I'm not sure that a format like this is the right one for the enterprise. Is social networking actually useful in order to increase companies productivity and to better support organization in general?

Twitter is becoming more and more useful because instead of having to follow hundreds of blogs I can now switch to people micro blogging channel, which is updated daily and definitely shorter. It's easier for me and I can be reached by information even on my mobile phone.

I can't find the same level of usefulness in Yammer right now

A short black out to recharge batteries

noreply@blogger.com (Massimo Sgrelli) — Wed, 04 Feb 2009 21:41:00 +0000

A long time is past since my last comment about WorkOutLoud, and in part it's been because of vacations, then I've been sick and the doctor forced me not to touch a computer for more then 15 days, then I have been back to work and the daily chores and company priorities filled my time. Lots of things.

I read a lot and I spent good time with my family.

Now I'm back, hopefully to invest some of my nights on this and other projects.

Rethinking WorkOutLoud

noreply@blogger.com (Massimo Sgrelli) — Mon, 08 Dec 2008 14:07:00 +0000

The main goal of WorkOutLoud is to allow people to work well, and that is continuously forcing me to think about how this application is going to be built, and what functions to include and what not. In the last few days I was able to spend some value time on thinking seriously on what I've already decided to include in the product first release, and that was not helping people to work well. Working well is a serious and tough goal to achieve.

Believe me, it's definitely one of the hardest things to do during your entire career. Sharing what you are working on, just to let others know and let you doing your job is hard.

After having spent a lot of time thinking about which is the minimum piece of information you have to share with others in order to achieve your primary goal, I understood you need at least two chunks of data:

a) what activity you are trying to accomplish

b) which project you are spending your time on

Some weeks ago I thought the first point was enough to leave other people happy, and let you work well. But now I know I was wrong. Knowing the project you are on, enable a rich amount of analysis and statistics, and people like your boss, you colleagues and your customers, love those stuff. The great thing about this approach is that with only these 2 small information, the system can achieve a huge amount of other data for you.

For example, you could get:

Reports on people daily work activities
Reports on total amount of hours spent on work activities
Time reporting facilities
Reports about how projects are proceeding
Planning effectiveness: hours on the budget vs hours actually worked
Estimate to complete information

and many others. You need to structure the idea of project, and assign it a budget (man-hours or man-days) if you want, and that's it.

I tried a first design of people daily report, and seems to work quite good:

In the next few days I'll be working on "re-thinking WorkOutLoud" a bit. There are some cool and simple functions to evaluate, stuff like "Suspending & Resuming tasks", "Signaling or appending open issues to a project".

Mix CSS and images on a web page

noreply@blogger.com (Massimo Sgrelli) — Sat, 29 Nov 2008 07:32:00 +0000

Designing a web page can be really easy, but when you have to implement it using XHTML, CSS and pictures, to get a perfect mix, it’s a lot less easy. Also a small part of your page can become really difficult to build in, especially if you want to get exactly what have been designed with a graphic design tool. One of the tough tasks is to mix up correctly colors in the CSS and in the pictures you have included in your pages.

Today I will discuss how to correctly include a picture in a text page making it completely integrated.

There are some considerations to be done and rules to be followed:

Colors. The same color is displayed differently on a style sheet compared to a picture.

Browser. The same color can be displayed differently on different web browser

Formats. Pictures can be stored in different formats, such as jpg, png or gif. Different picture formats make the same color looking slightly different. So, you have to make use of the same format for all the images you put on your web pages. It's really important, especially if the colors you are using are not "web safe".

If you are forced to use pictures and a style sheet tightly integrated on a page, you have to decide how to make their colors displaying identical. Let's go through a small sample.

Working on WorkOutLoud I had to implement this portion of a page:

In the previous image there's a portion on the right side where the light blue rectangle change shape and goes over the beige rectangle:

Now, this design have been made using Apple KeyNote in a few minutes. It didn't take time to me decide that the metaphor I used was ok and that it looked pretty nice too. In my CSS the two rectangles were colored using the "color: " attribute, and the arrow shape was an image. So as a first solution I tryed with an arrow shape transparent on blue side - in order to get the same blue from the background of the rectangle - and the beige side colored directly on the image. In this way I got something like this:

The final result was not really good: the beige side of the arrow image was looking differently from the beige on the backgorund. Of course I could try the other way around: leaving the beige side transparent - in order to get the color from the background rectangle - coloring the blue side, but I could assure you that I would get the same result.

The real problem is that colors appearance strictly depend on the render method you apply to show them up.

So, how do you solve this kind of problems? How do you correctly merge styles and images?

Actually is really simple, and many of you already know the answer. In a case like this the image has to win, and the best thing you can do is coloring the beige rectangle using the "background-image" attribute in this way:


...
background-image:url(one_pixel_beige_image.png);
background-repeat:repeat;
...

Of course the "one_pixel_beige_image.png" must be a pixel with the same color as the beige side of the arrow image.

This small trick solved my problem.

MacBook Air thoughts

noreply@blogger.com (Massimo Sgrelli) — Sat, 22 Nov 2008 15:51:00 +0000

I finally bought a MacMoob Air. I was waiting for Apple announcing a review of the very first model, with the capability to be connected to a 30" Apple Cinema Display . It's wonderful on any aspect: it's beautiful, it's light, it's enough disk space to work well, it's fast, the display is ... well ... good enough. It's a pity, but you know I was used to the 17" MacBook Pro which had a really good screen. The drawback of having a monitor not as good as you can expect is that some colors, especially the lighter ones, are not always showed at best.

Watching WorkOutLoud design on MacBook Air I noted that the light blue I was using in the header of my page was showed as white.

So I made a small review and this is the result:

This tiny nuance on the page header color will allow also to privilege people to have a good view of the application. Maybe it's something to take care in future.

The right tool to design for the Web

noreply@blogger.com (Massimo Sgrelli) — Sat, 25 Oct 2008 14:50:00 +0000

Don't write a single line of code before having clearly defined how your application will behave and look like. I really believe that!

The good news of using Ruby on Rails is that design your application is the most difficult part of the entire project. Some years ago I would have used Photoshop among all the tools to draw effective web interfaces, but when I met Rails I began gradually to change my mind. Rails drives you to the basics, teaching you that simplicity wins. Photoshop is awesome, but its simply the wrong tool to design for the web; it's the right tool if you need to draw cool buttons or small details to include in your pages, it's probably the wrong one for the most part of the job. Then I tried to approach web apps design using bare HTML and CSS. It can work if you have already defined all the metaphors you would use in your application, but this design practice assumes that you have some good abilities in prototyping on paper and, most important of all, that you would be your own customer.

In the case you need to show your work to other people, and they must agree on the direction you are taking before you can go farther, then you need a way to sketch for the web. HTML and CSS are good but you definitely need something different to try your ideas in seconds. This is especially true if you are in the business of consultancy: your customers need to be convinced by your visual analysis.

Keynote, part of Apple iWork package, is definitely the best tool I've used right now to design for the web. While you design for the web you need something that avoids you dangerous art-like distractions. To design a web application you don't need to be an artist, you need to be an engineer. Good taste helps of course, and probably is something you can improve during the years.

Keynote has everything you need: you can draw lines, draw squares and rectangles, use colors and shading. It's absolutely very good to work with fonts and text, and this is the quality I appreciate more than any other. It's really simple to get in, and it's cheap.

Recently I found this wonderful tool has a way to lock shapes position on the slide pressing COMMAND-L, similarly to layers locking on Photoshop (this is something I couldn't found on Power Point).

I really think this is all you need to accomplish quickly and effectively your job as a designer.

Details matters, always

noreply@blogger.com (Massimo Sgrelli) — Sun, 19 Oct 2008 07:11:00 +0000

A few mounts ago I had to manage one hour speech about the actual role of the designer in a web agency like Wave Factory. As many before me, I found a quote about Charles Eames that states:

The details are not the details. They make the design.

I strongly believe this is the essence of making a good design and a good project in general. Details have to be projected, observed and discussed. Details are not just a matter of aesthetics, they actually determine the success or the failure of your initiative.

For example, looking at Work Log module, I show on the screen the activity log of the last 3 days, but I know the it's important for the user to be quickly focused on today activities. So, today activities are black and other days activities are gray:

Moreover, Today is labeled in yellow, so that user could be quickly driven to that list.

The first design of the entire application flow

noreply@blogger.com (Massimo Sgrelli) — Sat, 18 Oct 2008 15:55:00 +0000

WorkOutLoud design is going to get its final shape. I reviewed many things along the way, but now I'm quite satisfied of the final result. I have four main areas designed:

Worklog
Memos
To do lists
Profile

Projecting the entire flow is a way to begin understanding if everything is consistent and useful. You fix the UI metaphors and conventions once and for all, you check that what you are going to develop is really something you need.
Today watching a video of Jason Fried speaking at Business of Software 2008 convention, I heard exactly the same thing. He said something like "Always be questioning your work!", which means don't solve imaginary problems and ask yourself "Is it useful or just cool?". That's why you need to watch the user interface of your application before to start coding.
You must be really convinced that what you conceived solves real problems.

Now it's time to show you what I have done right now:

this is the entry point of the application. People share their work log and watch others.

this is the main view of Memo, in which you can store short memos, notes or ideas.

this is another view of Memo page, the one you get when you click "Create a new memo" link.

this is the first draft for To Do List module. After having used for a while other to do list applications I decided that they are really useful to get your activities under control. I'm not actually completely sure I will include this functionality in the application; in the future I could decide to integrate WorkOutLoud with a third party to do list application.

this is the personal profile of the user presently logged on.

I'm not sure that what I designed will all be part of the real application, but finally now I can create WorkOutLoud code, starting from HTML/CSS basic template. The very first version of this application will include only the Worklog facility, so there's plenty of time to go back and rethink the product modules.

Is Juggernaut the right choice?

noreply@blogger.com (Massimo Sgrelli) — Thu, 09 Oct 2008 19:54:00 +0000

I'm thinking about WorkOutLoud application architecture: it should be pretty simple, except for the weblog updates deployment to the clients (people browsers). The plain solution to this need could be to adopt a polling strategy through simple Javascript functions. Of course this is not the most efficient solution to the problem. The best choice could be to use a push server architecture, and among the various options I could find on the Internet, Juggernaut is the best I've found. I read about Juggernaut at the beginning of 2008, but after having attended to the RailsConf Europe 2008 in Berlin, I understood what its potential actually is. This framework has been created by Alex MacCaw, a brilliant and very young guy from UK I had the pleasure to meet in Berlin last September.

The real advantage Juggernaut has compared to other solutions is that it is based on EventMachine - which scales pretty well thanks to its non-blocking IO architecture - and that it has a small but effective Flash component on the browser to manage connections to the server. This solution avoids many problems in terms of browser compatibility.

To confirm Juggernaut as the right push server for WorkOutLoud, I'm only looking for some data under heavy load. I know theoretically it has to scale quite well, but I would be happy to read something about other people experience. Unfortunately Google couldn't help me to much: it seems that not so many people have used it in production environments.

Any good article to suggest me?

Introducing Memo, a new functionality

noreply@blogger.com (Massimo Sgrelli) — Mon, 06 Oct 2008 19:54:00 +0000

Making your workday really productive requires an iron will, and during this days I'm thinking a lot about what can really help you reaching and maintaining your concentration. I've made a small list of what you must to work productively:

Start your workday checking your emails titles. Yes, only titles. Don't open them unless you believe it's really necessary
Close your email client: you can answer to emails later
Limit your social interaction to the minimum necessary: close Twitter, Pownce, and all the chat clients
The only tools you need to use are the ones you normally use to accomplish your everyday activities (Textmate+terminal, or Power Point, or Photoshop, etc.)
Signal to your colleagues what you are working on as soon as you can

I'm designing WorkOutLoud page structure with the specific goal to avoid you unnecessary distractions. When you actually start to work on a specific activity, WorkOutLoud have to hidden all the data related to other people activities, because you don't need them. If you decide to suspend what you are doing to have a quick look to other people worklogs, you must do it consciously. So, you leave your current context and you move to check people worklogs. You stop doing your job because you need to be in-sync with someone else activity. Be careful, I said "you need to be", you are not just curious.

What do you actually need at minimum while doing your job?

Thinking about how I work, I would say I need a plain notepad solution: a simple space to take notes and to fix some ideas. Very often I need to take a quick memo, without losing concentration or momentum, and stopping my current activity just for 5 seconds.

This is the function I'm currently designing, and I'm calling it Memos. This is a first draft of the its layout. Tell me what you think about it.

While taking notes, I think could be really useful to allow putting "tags" to them. Probably limiting the number of tags to 3 could help people to give real meaning to their memos.

Design first: work log page preview

noreply@blogger.com (Massimo Sgrelli) — Fri, 03 Oct 2008 21:27:00 +0000

The design phase of WorkOutLoud has began, and the first thing I have decided is I won't write a single line of code until I'll have a mock up of the entire application ready. After the experience I made building WhoDoes - the project management tool by GotThingsDone.com - I'm convinced that the best way to build a web application up is to forget start coding if the application layout is not totally completed. I've understood I need to have something real to look at for a few days, and I need to play a bit with it before actually starting implementation phase.

When you design a software application, you must quickly get the user interface done, and then take some time off, leaving all the initial enthusiasm goes away. Make some screenshots and print them all, and then hang 'em on the wall of your office. Spend 15 minutes observing them every day, looking for your colleagues positive criticism, and then, if you still think that is the right way to proceed, go through the coding phase.

You must remember that every business idea can be a major hit depending on a million of factors, and no one can actually say nothing about the results you can get but your users.

This blog will be my office wall:

This screenshot is a draft about one of the main pages of the application: the Work Log page. Let's suppose you want to observe one of your colleague activities (mine in this case), what steps you will follow to reach this page?
You look for 'Massimo Sgrelli' in the search box, then you click 'watch' to get my activity log on your watching list, and then finally you click on my name.

A first draft of WorkOutLoud funtionalities

noreply@blogger.com (Massimo Sgrelli) — Sun, 28 Sep 2008 08:04:00 +0000

Hi everybody,

today I'm thinking about what functionality to include in WorkOutLoud, and it's a good idea to begin reminding myself of the main goal of this Web app.

Goal: "Working ... finally!", which means "Working well" or "Improving productivity to have more spare time".

People will use WorkOutLoud primarily because they want to be more concentrated on their job during work hours. Even if this could seem obvious, most of us know that it's not easily realized. Colleagues, email, and now social networking too, can become a productivity killer.

Let's go to the list of functions I'm evaluating to include in WorkOutLoud - hopefully with your contribution:

Let people fill out their Work Log. This is the main functionality of the entire system, and it consists of a micro blogging channel. Users trace their working activity, leaving others to access that information (Q: public or regulated by a granting system?!)
Allow people to create To-do lists
Let them publishing small messages on a public and/or private Bulletin Board
Allow people to send Sync Messages to others inside the system (probably the messages would have to pop up instantaneously)
Provide a deadly simple tool to create small Notes or Memos
A built in Live Chat to allow people to attend remote meetings

I would like to have suggestions and opinions from all of you. The list above represents a first sketch just for discussion, and some could be eliminated as could be overlap. The functionalities listed are probably excessive and 2 or 3 modules could be enough. Does the list include all the tools people really need to stay productive?

Probably version 1 of this application will only have the first module, the Work Log. Everything else could be added thereafter.

Note: I'm thinking to use the work "klog" to refer to the Work Log (as Web Log has becoming "blog")

Let me know what you think, comments are welcome :)

Which target for you killer app?

noreply@blogger.com (Massimo Sgrelli) — Fri, 26 Sep 2008 07:19:00 +0000

If you've got an idea and you decide to put time and energy on it, it's really important to identify soon what shape you want to give to your business and what target your initiative will have. Let's suppose you choose to set up a revolutionary service you can deliver through the Internet, using a web application that you have invented. Before you start coding or designing anything, it's really important you take a moment to consider how answering to some fundamentals questions. The first question you always face is what your target users are.

You could project your initiative to address consumers people or to address business professionals.

Which one to choose?

Remember: targeting business users is easier than targeting consumer ones. If you design and set up a useful service through the web and you think you can make some money renting it, it's definitely better and safer trying to bet on business users, if only they can appreciate the opportunity to save some money and rent your software instead of buying a package or implementing their in house solution.

For example, to provide your company with a calendar sharing solution, you could choose Microsoft Exchange. That can be generally considered a good choice, even if it's not exactly the cheapest one. On the other hand, the Internet is full of calendar solutions that can represent a good alternative to the adoption of Exchange. You can typically evaluate them for free on a period of at least 30 days, and then deciding to rent them for few bucks a month.

Deciding to provide services to the consumer market is of course possible but definitely tougher. Think about YouTube, Flickr, Google or to the new born Twitter. They all are targeting the consumer market and they are probably among the most famous digital known brands. They have many things in common: they all received several millions of dollars in VC funding, they all have a huge market value, they haven't understood how they could make money until they get big, and even if they have payable subscription plans, they make the real money through advertising.

Why? Because normal people have been used to have access to a great amount of Internet services for free.

All these initiatives focus their efforts on setting up a community, and that's a costly thing to do. You need infrastructure, you need bandwidth, you need web designers, software programmers, project managers, marketing people and you need money to be spent on making your brand well known.

Do you know what happen when people put a big quantity of money in your company? You lose control of what you created.

Want to build the next billion company? Good luck, it's more likely you win the national lottery.

On the contrary, deciding to go create simple but effective business product can make you on the right way to set up a 1 million dollar company in a few years (if you a re lucky) - as perfectly explained by David Henemeir Hansson at the Start Up School 2008 last April at the Stanford University.

Twitter vs WorkOutLoud

noreply@blogger.com (Massimo Sgrelli) — Wed, 24 Sep 2008 13:42:00 +0000

Tools like Twitter are revolutionary. They are changing the way people learn, collaborate and socialize and represent the evolution of tools like Blogger, Movable Type and WordPress. Twitter was born from the same guy that first made money with a blogging platform, Evan William. Twitter is the easiest way to "share the moment", using less than 140 characters to tell others what are you doing or ... thinking, wondering, etc. Twitter is a general purpose tool, not specifically thought for business, nevertheless it's core idea can be rethought and applied to professional needs.

The main difference between professional and consumer targets is that ordinary people use tools like Twitter to be notified about small and often useless notes published by interesting people. They want to be alerted as soon as their friends "tweet".
Business people want to publish what they do if only to avoid other people interfering in their workday activity.

Twitter was created to socialize. WorkOutLoud is conceived to help you work well.

What's WorkOutLoud

noreply@blogger.com (Massimo Sgrelli) — Tue, 23 Sep 2008 21:24:00 +0000

Everyone has experienced, at one time or another, how much more productive work can be during other people's vacations. The office is empty and you can really be focused and concentrated on what you have to do.

No interruptions, no one entering your office or calling you on the phone. Every time you are interrupted by others while you are working on a task, you lose concentration, you have to start again from the beginning, and no one seems to note that. Why?

Additionally, your boss and your colleagues need to be informed about your work, if only to be able to do theirs. This fact has made me think a lot, because there must be an easier way to keep people posted about your past and current activities, without being distracted so much. In the end it is really simple, you have to notify what you are doing frequently and in a standard way. You must publish that data if you can. That information must be accessible to all the people you need to keep up to speed.

That's what WorkOutLoud is all about.

This blog is the place where I will share the journey of analyzing and implementing what such a kind of web application could require. I hope to get suggestions and some help from all of you.

Ruby on Rails is the technology I will use to get the work done because it is the best framework available right now (and because I love Ruby programming language too). It's a technology developed by a European software developer, David Heinemeier Hansson, released in open source on the Internet 4 years ago. I hope to be able to share some ideas, thoughts, questions and code very soon.

-- Stay tuned