Friday 23 November 2012

The 'Sync Design Problem' of adding images to this blog

I still don't have a good solution to upload images to this blog.

Here is my current workflow (as just happened for the image I just on my last blog entry)


Step 1: Take Screenshot  (easily done on the Mac or using the O2's screenshot utility)

Step 2: Click on Insert Image


Step 3: Click on Choose files 


Step 4: Find the file in my file system and selected it


Step 5: Look at the screen while the file uploads (the Blogger GUI is frozen until the upload finishes)

Step 5a: At least at this stage we can upload multiple files at once (and look at the screen for a bit longer)


Step 6: Click on Add selected


Step 7: Resize the Image (usually I chose the X-Large option which makes the image width 90% of the blog post width)



Apart from the the fact that there are 6 click on this workflow, the REALLY BAD one is step #5 where the Writer's workflow/mojo is broken while waiting for the upload to happen.

And the problem is that this should be an ASync operation (i.e. upload these pictures and let me know when it is done).

See, I don't really need those images to be shown immediately after I inserted them! I'm happy to wait a couple seconds, usually while focused on writing/thinking about the next paragraph (or even how to describe that image). I just need the images to be there before I publish the blog entry.

The problem is that I CAN'T continue writing until the upload is completed. Which is where the problem is.

Here is the workflow that I want:

  • Step 1: Take screenshot (and put it on clipboard)
  • Step 2: Paste the image (or click on a 'Put image here' link)
  • Step 3: Continue writing (on the next second after I did Step #2)
  • Step 4: The image is uploaded to the server (ASync, i.e. in the background) 
  • Step 5: After the upload, the image is placed in the location where the cursor was on Step #2 (a nice touch would be to put a little 'an image will go here' placeholder in that location)
  • Step 6: Resize the Image (if needed)
What is really powerful about this solution is that is only requires two clicks (in bold) and it is an ASync operation, which means that the writer can write continuously (without having to wait for images to be uploaded)

And this is what Design is all about!

Design is about:
  • improving workflows
  • reducing 'steps required to do xyz'
  • ASync activities (embedded in an Sync operation) 
  • finding Simpler solutions,
  • reducing the amount of 'brain power' that needs to be spent on 'non important tasks' like inserting an image in a blog post.
  • improving the user experience so that he can focus on what he wants. In this case I want to write a blog post (without interruptions of 'please wait while do do XYZ' delays) 

Design is not about making stuff look better. 

Design is about making stuff work better!