virtual hosting

The idea of editing-in-place is that the user clicks on a text and that text changes into an input field or text area that can be edited and saved. There are various solutions that involve plugins for jquery or a javascript function to replace the text node with an input field and annotating that text field with a class or an onClick event to activate the custom code.

angular.js doesn't have custom support for edit-in-place, nor are there any plugins. Instead a solution can be built with the means already provided. Just place the text node and the input field next to each other and then use the ng-show and ng-hide directives to display one and hide the other. Both directives check a variable with can be set using a function called from ng-click or any other ways used to trigger the edit mode. It doesn't get simpler than that.

Didn't manage to confirm any users yet, but will continue to work on that. In the meantime i'll think about a landingpage for them to go to. And hopefully the jump issues when editing can be fixed too.

Author :mbaehr   |   size :1285Bytes   |   Publish Date :Oct/3/12/17:15   |   to Top

Worked on a bunch of smaller issues this week. Removed some padding from the title to give it more room. Use "placeholder" to describe the fields. The textarea resizes as text is added. I found a compact vanilla.js solution for that. Action buttons are no longer links, thus no longer add an entry in the history when the action for a task is changed. The "jump to task" issue is still open, but i made a bit of progress understanding it, and i found some examples how to implement edit-in-place using angularjs ng-show which i'll work on next week.

Other goals for the next week are to start talking to potential users, and continue working on back button and "jump to task" issue if there is time.

Other ideas for improvements which i might work on in the coming weeks are comming up too:

  • server synchronization
  • website/landing-page
  • updating actions like: ignore/cancel, read (a book icon, can replace research), dl later(some kind of clock)
  • find a way to handle long descriptions

Author :mbaehr   |   size :1378Bytes   |   Publish Date :Oct/3/12/15:41   |   to Top

This week i couldn't spend much time on the email-task-manager, so i only managed to do a few small things:
The link color is fixed.
I hacked in an ability to create projects.
You can see the 3 plus buttons at the bottom of each column. Each button will add a project to that column. Moving around projects is not yet possible. This is just a stopgap measure to make the task manager useful at all.
I also removed the demo data, so that those who want to try it for real, can actually do so.

No luck on the other hand in getting auto scrolling ("jump to task") to work. angularjs has a service called $anchorScroll that is supposed to handle this, but i can't figure out how.

Next week i'll continue trying to solve the "jump to task" problem. I'll also look into geting the back-button to work right and try to make tasks editable. I am aiming for 2 out of 3.

Author :mbaehr   |   size :1143Bytes   |   Publish Date :Oct/3/12/10:06   |   to Top

It took some searching to figure out why the view would not scroll on the mobile with a fixed titlebar. I followed a few dead ends that promised to make divs scrollable using javascript and for a while it looked like i wouldn't get done this week. But then i struck gold!

Brad Frost gave examples that allowed me to figure out just which settings were needed to get scrolling and a fixed title to work on android 2.3.

With this out of the way, adding a new task form was easy. A [+] button in the upper right now allows adding new tasks at any point. The form picks up the right project from the context where it is called or defaults to "inbox". We can enter a title and a description, and the category buttons below double as submit buttons for now. We can even create a new project if we change the name. (The new project won't show up in the list yet though)

With that it is now possible to start using this tool and we can feed actual user experience into the development process.

Author :mbaehr   |   size :1368Bytes   |   Publish Date :Oct/3/12/09:52   |   to Top

This weeks goal is to create a "minimum product" as i realized that once it is possible to add new tasks, the product is usable as a minimalistic task manager. I am calling this a "minimum product" instead of a "minimum viable product" because i don't know if this version is already viable.

Viable or not, once the product is somewhat usable, we can get a better feel for how it works, how practical the overview is, etc. This will hopefully provide more insight in how to proceed and which features to add.

Here is one possible roadmap:

  • feature: add tasks in any project (the "minimum product")
  • feature: assign a task to a project
  • feature: create new projects
  • feature: edit tasks (is this the mvp?)
  • maybe publish this state as an app for iphone and android to learn about the publishing process.
  • add comments to tasks (later when the tasks are emails, and a comment is made on a task sent by someone else, this will effectively be like an email-reply)
  • explore APIs to access mail storage in the phone, or
  • extend the backend to store tasks on a server which can translate them into emails
  • since email is a core feature of our email-task-manager, probably this stage is the mvp
Author :mbaehr   |   size :1321Bytes   |   Publish Date :Sep/5/12/17:38   |   to Top

This week there was lots of work under the hood. Because jquery mobile does not support linking to page anchors i removed it and re-did the routing with pure angular.js The jquery mobile angular adapter and even jquery itself were also removed.

This wasn't hard because the main reason to use jquery mobile was for its styles which can also be used directly with only the jquery mobile css file with a bit of effort.

Unfortunately, although angular.js claims to support going to page anchors, i didn't get that to work yet.

Next, the datastructure was refactored to use the browsers localStorage. I decided to store one task per record to make updating individual tasks easier.

At the moment this appears to make the application slower, and the main reason for that should be that the same records are being read multiple times, but i stopped there in order to focus on functionality and get the first update feature in place instead.

Author :mbaehr   |   size :1240Bytes   |   Publish Date :Sep/5/12/16:46   |   to Top

The projectview is reached from the overview by selecting a project. It shows all tasks in a compact list.

In order to select a project we need to pass the projectid to load the tasks for that project. usually one would do that in the url, but jquery mobile uses the url to decide which section of the file to show as a view.

The solution turned out to be an angular.js service. A service is shared among controllers and in our case has functions to set and get the selected project.

Btw: i discovered a very nice framework called vanilla.js. It is a lot faster than any other frameworks. It is also widely supported and well documented.

Author :mbaehr   |   size :918Bytes   |   Publish Date :Sep/5/12/16:29   |   to Top

We got several comments regarding the usability of the overview. The icons are small and hard to understand and it's not clear what can be seen here. The interface is confusing, to crowded.

It's hard to respond to that. One thing about the overview is that we are more or less treading new ground here. I have not come across any application that provides an overview like this. Most email clients and task managers give you a list of folders/projects and maybe the number of messages/tasks inside and at best an indicator if there are unread messages.

That's simply not enough.

To get a good overview we need to show more information. At a minimum i am not interested in the total number of messages, but how many of them i need to work on.

We want a concise summary of the state of our work.

So i don't know how to make the overview any simpler. Technically there is only one button per project. So as far as interaction is concerned, it is very simple. You can not select the individual icons, but only the project as a whole.

What makes it complex is only the amount if visual information provided. Here i think the tastes can differ a lot. Some people like dense information, some don't.

There is already a suggestion to replace the project list with just the total number of actions per icon for all projects together. Less useful for me personally, but could be provided as an alternative view.

Another thought is to use a tag cloud kind of thing and scale the project buttons according to the number of open tasks in each project.

I am looking for more ideas, however for now i am not working on the overview but focusing on other functionality so that we can complete the MVP and test actual usage.

I am sure the overview will evolve, maybe we find a way to make it less confusing, looking less like clutter. But less information would defeat the purpose. I want more information if we can find a way to fit it in without making it harder to understand.

Author :mbaehr   |   size :2355Bytes   |   Publish Date :Sep/5/12/16:01   |   to Top

This weeks goal was to learn how to work with PhoneGap/Cordova. Because of that i figured i could just link a Phonegap tutorial for this weeks goal. The report video is worth watching though. It covers the PhoneGap installation with eclipse, which went smoothly following the instructions on the website. Another Highlight this week was that we received 6 "awesome" votes, which is enough to get us over the minimum of 10 needed to access mentors.

Only two details are worth noting about the installation: The instructions call for installation of the android SDK, but it turned out that when installing the eclipse android plugin, the SDK was downloaded and installed right along with it. So you can skip the SDK step. The other point to note was that if you want to use the emulator you need to use the SDK manager to download a system image and then create a virtual device using the device manager. After that you are ready to roll.

Since the install was smooth and painless i moved on to the next step and quickly implemented the mockup in static html/css. i also tried to build the html from a function using jquery, but had no luck with that.

Why PhoneGap?

I have looked briefly at whats out there and somehow PhoneGap came to my attention. I watched some introductions and found that made a good case being all Free Software and supporting many platforms.

One great feature is that you can mix native and html views

Now they see it as allowing a transition from a native app to an html app, but i see also the reverse as ultimately we wanted to build native apps. This will allow us to do so without having to start from scratch. Instead we can focus on adding native code where it matters, where for example html is to limited to achieve a certain effect that we need or to slow. (It may turn out that we never need that, but it is good to have that option)

Also their stance of believing in the vision that all future mobile apps should be based on html and css and that they really want to make themselves irrelevant by expecting that eventually the browsers will pick up that functionality (so that all you need to deploy is html, css and js) is quite interesting. I am not necessarily agreeing with their idea of the future, but i certainly like their approach to it.

The phonegap guys even claim that they don't have competition.

Author :mbaehr   |   size :2963Bytes   |   Publish Date :Aug/22/12/15:05   |   to Top

For mobile interfaces we need to drastically reduce the amount of detail in order to fit just the right amount of information onto a screen. The overview should convey the amount of activity on a selection of projects.

We got some amazing feedback for the first draft. Even though it was just hastly sketched on a whiteboard, people seemed to understand what this is about.

See for yourself:

Author :mbaehr   |   size :626Bytes   |   Publish Date :Jul/31/12/11:45   |   to Top

Stories of MeetET

(skip to the first story for fast reading)

Why “MeetET”? Because we will unlikely market our new product as “email-task-manager”, that's both too long and doesn't address its advantage. “Efficacy” perhaps is a better name, but before a final name is decided, mentioning MeetET gives a context of how a properly marked product blends into daily life. MeetET is short for “Meeting, Email-Task manager”.

Why stories? Because life is a story but we always want to patch it up with use case here and use case there. Instead of skipping use-cases, I did WORK on use cases, but I am still losing the picture of overall user experience: the change good software can do to make life better. Thus the stories. The validity of use cases are less mysterious given stories. Also, having user story helps the design integrity. Disneyland is not designed by only analyzing user need and use cases, the general experience delivered is their advantage, their design is highly integral.

What is a good story? A story doesn't describe the user interface, nor the use case in traditional sense. It depicts user's life and user's software, how she uses it, in such a narrative style that everyone can understand. It is both terse and content-rich. Its target audience is not only developers but also users, to let them validate these stories. Notes to software developers are separate.

First story: Back at your own backyard

Day 1.

After lived in Beijing for three years, Alice went back to her hometown YY. She doesn't know where in the end life is going to take her to, but at least she is staying for the year to give birth to her baby, perhaps out of the feeble wish of not letting the child start with a drifting life such as hers. In a sunny afternoon shortly after her arrival, she find herself having tea with her old friends in college: Bob, Coral and a few others.

The reunion brought a lot of memories. Alice is not particularly the sociable type, not as much as her “party animal” friends, but having the advantage of studying in the medical school of her hometown, not far away from her own house, she did host parties at her home backyard, from time to time, and thus developed some decent relationships. Her usual party guests are of the calm type: researchers, classmates, professors, and even doctors of the hospital where she had the internship. After graduation, she stayed teaching in the college and worked as a lab assistant, eventually her home party become the center of attention of local health-care and medical professionals. That is, of course, all before she left YY for better career opportunities.

“So where do these people meet now?” “Nowhere. Since you left, they don't meet. They live their own lives.” Dissatisfied with the situation, Alice encouraged Coral, former lab assistant trained by Alice, to take the lead and start connecting people again, for Alice herself is unlikely to be in town in the future, thus cannot keep doing parties. Coral likes the idea, but asked Alice to help organize the first a few parties. Alice notes down that she should “re-discover” her old contacts and invite them to the next party, which Coral will host.

Day 2

After the party, Alice started to discover her old contacts. Most of them gets to know Alice before “Linked-in” was invented, thus they are kept in Alice's private addressbook, which is in her old desktop computer. She had been using the Addressbook shipped with Windows 2000, actually, as a part of Outlook Express. There are a few categories, two of them Alice is interested in: “Professional Practitioners”, “College contacts”, “Classmates”. All college contacts should be invited, even the clerks may be interested to be in the party just to get connected to the professionals, and they may forward the invitation to others they know by work. The “Classmates”, are gradually turned into either “Professionals” or “College contacts”. “So, perhaps I should start by assigning new categories for each of the classmates.” Alice think, “but why bother? Since my job is not here, they don't make any difference to me now. But no, I still need a category for college contacts, because I may specifically batch mail to my old college contacts in the future: what if I decided to find a job in the college and settle down in YY?”

She is not using Outlook Express any more. A year ago she switched to MeetET. She knows she can save Outlook Express contacts to a file, and import it to MeetET. Alice thinks, instead of re-assign categories in Outlook Express, it would be easier to import all of them to the handy MeetET and update categories there.

But she failed. When she imported all the contacts, they are not with their category information. So the category information is lost. MeetET now has 150 new contacts waiting to be labeled. Noticing MeetET asked if the user wants to do any batch change during importing 1
1:Allowing discovery of new features, learning and re-doing in a better way, is perhaps a good approach.
, she decide she could save the contacts 3 times, one category per file, and import to MeetET 3 times, each time using a new label. But to do that, the 150 new contacts must be removed first. Luckily, MeetET offers to revoke the last import, so she did. 2
2:Isn't this too fantastic? Realistically perhaps user should get a guarantee that the system knows not to duplicate contacts, and let the future imports overwrite the previous ones.

So here is Alice at the beginning again. She imported “Professional Practitioners”, labeling them as “Medical & Health-care”. Why change the name? Since she left her home-town her contacts expanded. She now have all kinds of professionals, like lawyers, among her contacts. “Professional Practitioners” isn't as descriptive any more. Besides, she already has many labeled with “Medical & Health-care”. In order to tell locals from contacts of Beijing, who should not receive local event invitations, she made all imported contacts “Locality” to be “YY”: there is an option for that during importing.

Then, Alice imported all “College contacts”, again to “Medical & Health-care”, except she added that this import should all have the “Organization” name to be the medical college's name. She could have created a new label, but she think she already have too many labels, a “Organization” field is enough to tell the difference. MeetET has an option to retain the old organization name too 3
3:This is a case where allowing multiple value for a single field is helpful.
, but she think she doesn't need it, and let the old organization names be overwritten.

The trouble comes when Alice imports “Classmates”. Many of them are also in the category of “Professional Practitioners” and “College Contacts”, but that's not the real problem, since MeetET knows to identify and merge duplicates. The real problem is most of them are no longer living in YY. MeetET has this message to Alice:

Some of the 70 contacts have “Locality” information, they are YiYang, ShangHai, BeiJing, GuangZhou and a few others. 4
4:Is this smart or stupid?
The “a few others” words is a link, so Alice used that link to know there are also friends in Shengzhen, Xiamen and YiYing. Alice knows YiYing must be typo of YiYang, the mistake is probably a decades old. She corrected that one the spot. 5
5:If one needs to correct a typo by a whole lot of operation, and, at the cost of losing her work context, she might give up maintaining contact book in details.
Alice knows, of the contacts which doesn't have locality information, many left the town, later than she did. She tried to tell those who stayed from those who left, and after 5 minutes she thought: why bother? So she imported all of them under the old label “Medical & Health-care” and added a new label “Classmates”, filling YY in the locality field if there was none 6
6:Can user actually understand their use-case is this complicated? Perhaps we should default to a strategy.
. She thinks to herself: I will add a postscript message in the email invitations, saying “if you are not in YY anymore and prefer not to receive such invitation in the future, please write back to let me know”.

After all these, she add a todo list item: “When Coral arranged the party, I should send email invitation to my contacts to introduce Coral and her party. All my Medical & Health-care contacts in YY should be invited.” There is nothing more to do now. It's too early to write and send invitations. Alice needs to wait for Coral to fix the event. So Alice wrote an email to Coral:

Dear Coral

I checked and found 150 contacts to send the party invitation to. After these years, I don't know how many still remember me, not to mention showing up in the party. Perhaps less than 10 would come. I should let you know my contact list, but consider many email address will not be valid any more, I will send the invitation myself and receive lots of returned emails. When I refined my contact list after the event, I will send them to you. I'll certainly make the audience aware the next party invitation is likely to be from you instead of me.

Please, when you fixed the time, location, invitation text, send them to me so that I'll make my invitations. Great to know you intend to volunteer the event organizer!

I'll be inviting my contacts, but don't forget to invite your own contacts too -- I don't know everyone in town!

Then she dispatch the email, expecting a reply in 6 days. Right now there is nothing to do, so this email is not going to be in her INBOX, a queue of things she should process. By “telling” MeetET she is expecting a reply in 6 days, she knows MeetET is going to put this email back to INBOX 7
7:Or back to TODO queue?This is a bold guess of how the software will work. This part is not the best I guess, because it doesn't look nature. Alice todo management looks too refined. Real-life Alice's workflow perhaps is more disruptive.
if this discussion thread remain idle for 6 days so she could do something about it. That is, if Coral didn't reply the email in 6 days or if she didn't reply her reply in 6 days, until this discussion is marked over. 6 days is an expected “pace” of the communication.

Day 3

Alice received an email reply from Coral, proposing to meet in a cafe run by a friend of hers, to check if the cafe is a good option for the event. Alice marked the email as an event, which automatically make her mobile phone alarm her an hour ahead. 8
8:Better be done with as few clicks as possible. People don't want to invest too time in the trivial things they think they can probably remember themselves. And, if it is not by default connected to the most handy mobile device, they probably don't mark the event at all.

The cafe is nicely decorated. Alice raise the concern that the cafe is a bit too stylish, and perhaps a bit too noisy. “I would hesitate before going there if I received the invitation”, said Alice. Together they figured instead of hosting the event in someone's home backyard, or a cafe, the “right” home of it should be in the college. And, to add a reason for guests to come, they should organize it a public presentation / training followed by a free-talk dinner party, in the campus. Event starts at 16:00, a professor or doctor would give a speech, inviting colleagues, medical workers in town and students, or, once in a while, patients too, with a poster as a invitation. The topics  range from latest medical discovery, ways to work-around the buggy health insurance system, to how to sit properly in front of a computer.

This look more sustainable. After all, Coral is not sure if she has such charm of getting the people and making them enjoy their time. Coral need to borrow support from the speakers, the professors and doctors. Coral knows many who does good speeches, so do Alice, but Alice has better charisma. Alice realize suddenly she has a lot more burden. The simple idea is developing into a project. She took the following notes as project plan: 9
9:Is project in the scope of That Product? Perhaps true. Is the project budgeting, task dependency, timing, in the scope of That Product? Not sure.
  1. 1.Need to communicate with reputable speakers among her old friends about the idea of this speech/dinner event, get their support by having them host the speech the first a few rounds. 

  2. 2.This event needs a name. 

  3. 3.Find the school officials to let them agree and arrange conference rooms. This shouldn't be difficult, because the officials wants to look active to their superiors, thus needing events. 

  4. 4.Do we need a hit success to kickstart? Yes we do, without a decent group of people already sticking together, if the first a few events ain't populated and successful, it would be hard to slow-start. To be that successful, there should be posters, announcement from school intranet, etc, for the first a few events. 

  5. 5.Coral would need Alice's help in the first a few events, perhaps 3 of them, but Alice is likely to be giving birth in the next 3 months. Coral perhaps has to try to host the second and third event, or use other friend's help. 

The two, sitting in a cafe, decided that Alice is to invite speakers for the first event and to prepare a list of potential speakers for Coral. The rest are all Coral's tasks. Alice is to be watching over the event on the email.

They still have a bit of time in the Cafe, both Alice and Coral sat down to browse Alice's contact book, all “Medical & Health-care” contacts in YY, to select potential first batch of speakers. Alice isn't sure if she wants a new label “Potential Speakers”, because she is unlikely to be hosting the events in the future. Coral would need this list. MeetET has this convenient feature of marking a contact with a star mark, so when they browse the contacts, Alice put a star mark on whoever might be willing to speak in the first a few events and be successful with his/her speech. A star mark is not a label, but a way to collect a few people to do batch operation, e.g. putting them all to email recipient list, or change the locality for all of them. 10
10:I was with HBF employee once, to explain how to label email in Thunderbird. People ask: how to put a star mark on emails? I ask, why do you need a star mark when you can label? But they say they need star marks when they don't have a system of labeling. I think it perhaps allows progressive learning, but now I found even experienced users who have a labeling system need star marks from time to time. Here is one such case.

They went through all contacts, and find 16 people they should talk to about speaking. During this, Coral reminds a few people, who are also contact of Alice, but wasn't there on Alice's contact book. Alice entered these contacts with her phone, with label and “locality” too. MeetET allows returning to the previous context after the new contacts added.

Then, Alice use the email icon to start a draft email with the 16 star-marked people in recipients. She is not sure what to write there, so she wrote “need to discuss the event and invite first speakers”, and saved the draft as a task. The task, is, of course, to actually write the email, which she doesn't want to do in the cafe without her keyboard. She is not sure if she would address these people together or one by one, since there are senior professionals who better be addressed individually. But that's to be decided later.

So they say good bye to each other. Coral asks, if she can get a copy of the list of these “star” contacts, so that to review and think of new ones. Alice said yes. She first thought of to convert the 15 contacts from email recipients to email attachments and send to Coral, but MeetET doesn't have this feature 11
11:It doesn't seems right to put such a feature to the software, but I could be wrong. The system needs integrity to make user's mind mapping of the system match how it really works, thus it should not be just a collection of features here and there.
. Luckily MeetET still have these contacts with star-mark, so she exported these contacts. There are 3 options: 1) get a spreadsheet, which she could attach to an email later; 2) get a table, which can be in the email itself but requires HTML email, and finally get a definition list, which is okay with text-only email, which usually perform better on mobile phones:

Joshua Gram

073-8837268, jushua@mail-on.us, Sales Representative, of Dongfen medical equipments.

David Jones

073-8726384,david@johnes.com, Freelance


Coral is in the lab most of the day, rely less on mobile device. Alice foresees Coral will be working with a computer, thus choose to send with HTML table in the email. “Coral can copy and past the whole table to a spreadsheet if she wants to”, thinks Alice. 12
12:Can she, an experienced user, actually think that way? Am I being too geeky when writing this?
While the email is being sent, she decides to create a new folder for this unnamed event, to hold all communication related to this project so she can have an overview when she wants. 13
13:Martin: you can see this step is essential to having a project overview view as you made.
The folder name is simply 'YYevent”. She created the new folder upon sending of an email, thus the email just sent is in that folder.

When the email is gone, her mobile phone then entered a view where the recent activities are listed there. Of them, the most recent, is the draft email with 16 recipients. She put that to the new folder too.

Having observed all these, Coral asks if she could use the powerful new tool, and soon she got one, too.

(the story is not over, I have plots for the coming days. Perhaps these stories look complicated, but having been a groupware service provider for 8 years I guarantee I observed or experienced things in real life can be complicated like that, and we are not going to design a solution only to solve the simple issues, there are already tons there, and they don't offer enough capacity for busy managers or even normal users who are stuck with efficiency problem.)

Open questions to the ETs (the developer of this product):

  1. 1.What do you suppose user do with their notes above? It is not Alice'svv to do list (e.g. the last bullet point is only informative), nor others todo list on which Alice has to keep an eye. Would user write the notes in paper? Would user write them in mobile phone? I suppose paper or tablet is faster than a phone, so she would use a piece of paper if she is not with her tablet. In both case, what should user do with it? One guess, they process them into their project folder: one as a todo item; many as a watchlist item; the last one as a memo (or simply discard it). In this case, this note is an INBOX queue. The other guess is the user will never look at this note again, it fades away slowly, which is what happens now without a good MeetET software – Sould MeetET change that, or just cope with the facts? 

  2. 2.Should user use a label or a folder on email-tasks? The mailbox folder, as a tree UI widget, is not a good idea on the small mobile phone screen, but its concept as a collection or queue still have its merits. A folder is naturally a collection, an exclusive container, a method to address efficiency (Getting Things Done carefully reviewed the necessity of containers), while a label is naturally informative. You can imagine all messages in a project forms a folder, while the label could be “To Do”, “Useful for later reference”, “I love it, it's a good idea, one day may fruit.” For an easy-to-use product, label is probably enough. For efficiency, perhaps we need Folders. I am still thinking and rethinking these concepts. 

Day 4

Alice added the following items to the newly created YYevent folder:

  1. 1.She already have a draft email to the 16 potential speakers. It's a todo item. 

  2. 2.She wrote an email to suggest a name of the event, to Coral. 

  3. 3.She has a watchlist item: Coral should send her the draft of first event's invitation. 

  4. 4.She has a watchlist item: school official arrangement,, meaningCoral should forward her communication with the school official or the result of it. 

  5. 5.She has a watchlist item: She should expect Coral to send her the poster design. 

Now, she discard yesterday's project note, because everything on that note is now in her work-flow. She didn't set any alarm on these watchlist items, because Coral should set the pace. If she did, she will get related items back to her INBOX queue when things she expect did not take place.

Day 5

Alice received an email from Coral, saying the school official is happy with the idea, and arranged location. When Alice file this email under YYevent folder, together with a terse “it's great” reply, she was offered if this new email is expected, along with her watchlist items. She choose to close the expectation “” with it.


Author :mbaehr   |   size :29305Bytes   |   Publish Date :Jul/17/12/06:33   |   to Top

We were looking for answers, but we found more questions:

Web vs Mobile?
This is mostly discussed in the previous post. The main argument revolves around the idea that web-interface users are a different audience than mobile users and would lead the project into a different direction away from a solution suitable for mobile users.
iPhone vs Android?
Although both of us use Android devices we assume that there are more potential buying customers on iPhone. Personally, i also prefer learning Objective-C than Java.
Standalone Client vs Client-Server?
This is a new topic that we need to discuss further. One argument in favor of a Standalone Client is that offline operation must be possible. I believe the advantages of a Client-Server solution are that we can reuse existing server components and thus produce a prototype faster. Also i believe that server synchronization is crucial. My data must be accessible from anywhere.
App Sales vs Subscriptions?
Another topic that's not hashed out yet. I believe that server subscriptions are more profitable. Zhang Weiwu has been burned by a failed attempt at making subscriptions work in a previous project. I think we need more input on this question.
Start with the core vs a peripheral component?
The idea of starting to build a peripheral component instead of the main client is that it would be an opportunity to learn on something less critical before diving into the important parts.
Start with Front and Back-end vs only Front-end?
For a Client only solution we of course need at least a minimalistic back-end, but for a Client-Server solution we can reuse server components and thus focus on the Client Front-end

due to time-constraints of getting this published, not all statements here are verified, and may need some clarifying.

Author :mbaehr   |   size :2156Bytes   |   Publish Date :Jul/10/12/18:55   |   to Top

It is astonishing how much feedback we got on our week-3 report. Lots of encouragement and confirmation for the idea but also very specific suggestions like reducing clutter by lightening up UI elements in the email widget or hiding them until the widget is touched with the mouse.

Zhang Weiwu is back in town, so now we finally have a chance to discuss our product development strategy. Should we focus on a webservice or mobile apps first? We'll look at both strategies in detail and then see which one looks better.

Author :mbaehr   |   size :751Bytes   |   Publish Date :Jun/28/12/08:29   |   to Top

Unfortunately i was not able to work on this weeks goal at all because i was busy with a customer project where i worked on a feature to support multi-language websites on societyserver.org. I also worked on a tool to export the document history from the server into a git repository. it is still not complete but for now it produces a stable git history. (ie if the export is restarted the same history is produced). of course this git-exporter will also be usable for the email-task-manager project so i will continue to work on that to eventually make sharing and reviewing code easier for others. i will upload the video here after i resized it in Kino.

The goal video this week was edited in Pitivi, because i could not figure out how to edit multiple tracks in Kino. Pitivi allowed me to easily mix the sound from on recording with the video from the screencast for the second half of the video. Both recordings were made at the same time so it was just a matter of lining them up, which i barely managed to do. Pitivi also exports to webm which produces a compact format good enough for embedding.

Author :mbaehr   |   size :1377Bytes   |   Publish Date :Jun/13/12/10:20   |   to Top

When adding ein-place-edit for the submission form i realized that there are to many actions for a click in the same place.

  • click to show the body
  • click to edit the title
  • click to open the email
  • click to drag

As a result for next week i'll focus on redesigning the email widget to cleanly separate all actions.

Author :mbaehr   |   size :592Bytes   |   Publish Date :Jun/25/12/03:49   |   to Top

We have joined nReduce to see if we can use it to increase the momentum on our email-task-manager work.

We'll be posting weekly updates here to match with the reports and goals that we send to nReduce.

Watch our intro video and the before-video for the first week below..

Both videos were done on a DSLR camera and cut with the Kino Video Editor. I tried to do a screencast for the second video but i don't have a good microphone. There was a lot of background noise. (maybe i should try to use the camera to record the sound and then splice them together :-)

Author :mbaehr   |   size :875Bytes   |   Publish Date :Jun/7/12/03:44   |   to Top


  • You receive tasks by email
  • You send tasks to others by email
  • You use email to remind yourself of a task
  • You want to track the status of a task contained in an email
  • You want to find out if a task you sent to someone is completed
  • You use email to track things you want to remember
  • You like to have an overview of the projects you are working on, be able to see which project needs attention
  • You want to select tasks to work on today

If most of these items describe you or your working style, then the email task manager we are working on is for you. It aims to solve the following problems:

  • Provide a task based workflow for handling emails, that is instead of the traditional flags like important, replied, read/unread, new, old flags are new, in progress, waiting for response, follow up, completed, ignored (for emails i know that i don't want to read). Reading an email doesn't change the new flag, instead a flag should be chosen according to the next action. If no action is needed it can be marked as completed
  • Share the task status with the sender and all recipients of the email. If the status of an email changes, an automated message is sent with the new status. If the recipient of the message is also using the email task manager then the status on the original message is simply updated, so that no new email needs to be processed by the reader.
  • Provide an overview of projects by showing the most recent not completed tasks/emails for multiple projects at the same time. No need to open each project to see the tasks and messages inside. A quick glance across the projects is enough
  • Manage a shortlist of active tasks that you want to work on next (eg today). This list can serve as a reminder of what to do next, especially for those otherwise easily distracted. It also visualizes the progress of your work. (for some seeing that progress, and seeing the todo list for today shrink, is a good motivator

How did we get here?

For a long time i had trouble managing my work and my email. I tried writing todo lists, but these got lost somewhere in the computer. I can still find some of them, but if i don't see them then they are easily forgotten, or they are pushed aside by more urgent current events. I tried todolist applications on my mobile phone. But tasks are cumbersome to enter and update, and no task manager that i used offered to select tasks to work on next.

It wasn't until i started using large whiteboards to track tasks, that things improved. The whiteboard provides an overview of all projects and major tasks. It is easy to update. I can mark tasks to work on next. In fact i can add any kind of custom marks and details.

One of the projects i am working on is the redesign of sTeam. For this redesign we are developing a number of targeted applications like a blog, a file sync tool, and recently a tasktracker. Not the email task manager, but a regular task/issue tracker.

The task tracker was almost complete when i came across an article by paul graham about ambitious projects. In it he proposes to replace email with a new task based protocol. It immediately made sense. I am using email to track many tasks, and i'd like to have some of these features too.

Now, i am not going as far as coming up with a completely new protocol. I think that SMTP is still good enough for this purpose for now. Instead, the task status messages can be added at a higher level, as headers in the MIME message itself. Sticking with SMTP also has the added bonus of allowing backwards compatibility with traditional email clients. They too can receive status updates, they just need to process them manually, instead of having the client detect status changes automatically. We will eventually need to come up with a better solution to push updates, but this is a problem that needs to be solved for email regardless of addressing the task nature. Various attempts to solve this problem are already being worked on. So for now we'll focus on the task aspect.

For the overview i am drawing on my experience using whiteboards, attempting to recreate the whiteboard experience on a computer screen. The vision here is to have a huge computer screen on a wall somewhere, where an overview of projects can be seen from a distance, and manipulated through a touchscreen interface.

But also on the small screen, such an overview will be helpful. I used to have 4 email clients open at once so that i could watch 4 folders at the same time. (i had to reduce it to two because the machine could not handle the load), and in fact, looking at my mobile phone, there i have arranged my tasks in several small boxes allowing me to track different projects or contexts at once. So an overview seems to be a recurring theme in my work management habits.

Validating an idea

The currently ongoing work is to build a prototype to validate the ideas and premises. Hopefully i can find other users who have similar problems and find my approach helpful too. Our initial prototype is a webinterface because here we can build upon existing tools to handle email and user management allowing us to concentrate on the userinterface functionality and design. Besides, a webinterface is an easier entrypoint for new users to try a new application. Here is the first rough cut: you can see the inbox to the left, and projects in the center. The 'current' box on the right shows tasks that are selected to be worked on today. Clicking on a task/email will reveal the first part of the content for help with categorization. Double-click will open the whole message. Tasks can be moved around from box to box to be categorized. Dropping a task outside of the boxes will create a new project.

The project boxes in the center can be moved around to allow arrangement of projects for convenience. Double click on a project will open it to zoom in onto that project and instead show the projects inbox on the right as well as subprojects in the center. Clicking on From will show the list of participants of that task, those that will receive an update when the status of the task changes. Entries in that list can be added or removed. The '[+]' button allows adding of a new task, status (like new and done) can be updated, as well as hours can be tracked. (for those that don't care about tracking time, this can be hidden or replaced with something else)

More work is still to be done, but you can see it taking shape.

Building an ecosystem

The webinterface is just the beginning though. We also want to reach users who prefer to handle their email locally and offline. And of course those using mobile clients, like smart phones and tablets. So in the long run we aim to build a webinterface, a desktop client, a mobile phone app and a tablet app. Each of thses should have the interface optimized to the respective screen size.

Beyond email

Lastly, it doesn't end with email. Tasks could come from other sources too. Instant messaging, rss feeds, bookmarks, etc. If you follow a blog for your research, you'll likely hit on entries that lead to followup tasks. Some bookmarks are on pages that you want to remember to do something with later. That means they are tasks. All open tabs in my browser are tasks of some form. The only reason to keep them open is to do something with them later. How this can be integrated in a meaningful way remains to be seen.

Author :mbaehr   |   size :8053Bytes   |   Publish Date :Apr/12/12/14:58   |   to Top

Some of us have been called away from xiamen to meet some clients elsewhere and thus had to interrupt the retreat and delay the finale by one week.

That finale happened today: a coding-for-fun event at the angry robot coffee where we presented the progress of our work among the other projects there.

One group of students and a few other guests made it to the event. The students presented their project, a website that allows them to tag themselves and their peers with skills so that they can search for help based on the tags. An idea similar to hacker buddy. Another project was work on a drupal website. Myself, i worked on analyzing the codepaths for handling an http request in sTeam in order to find out if we can apply stylesheets to documents by default without breaking anything. As a special guest we were graced by Daniel Veillard, author of libxml2, libxslt and libvirt.

Almost a dozend people where hacking throughout the day until dinner time. Around 5pm we did a round of presentations where each project gave a rundown of what they worked on today. The feedback was throughoutly positive and it looks like we have 4 volunteers interested in hosting more events so that coding for fun in xiamen will hopefully be able to continue on a regular basis.

The state of the task-manager

We didn't get as far as we hoped. Progress was mostly hampered by lack of experience with jquery. But some of the basic features are already visible: you can see the inbox to the left, and projects in the center. The 'current' box on the right shows tasks that are selected to be worked on today. Clicking on a task/email will reveal the first part of the content for help with categorization. Double-click will open the whole message. Tasks can be moved around from box to box to categorize. Dropping a task outside of the boxes will create a new project.

The project boxes in the center can be moved around to allow arrangement of projects for convenience. Double click on a project will open it to zoom in onto that project and instead show the projects inbox on the right as well as subprojects in the center. Clicking on From will show the list of participants of that task, those that will receive an update when the status of the task changes. Entries in that list can be added or removed. The '[+]' button allows adding of a new task, status (like new and done) can be updated, as well as hours can be tracked. (for those that don't care about tracking time, this can be replaced with something else)

More work is still to be done, but you can see it taking shape.

Author :mbaehr   |   size :2965Bytes   |   Publish Date :Apr/8/12/19:53   |   to Top

Work continued on sTeam integration while i completed reading up on the last years of chandler development, trying to figure out what brought the project to a halt. It looks like it was the rather abrupt ending of funding. I suspect that a project that starts with paid developers will be disrupted if it doesn't develop a strong volunteer community before funding stops. I think that it would have helped to keep one developer on the payroll, to ensure a slow but steady continuation that gives the users the hope that development doesn't end and invites them to speed up the pace by volunteering. Keep the project alive with minimal funding instead of killing funding outright.

Reading the chandler blog also brought up some good user stories that apply to our project as well, giving us some material to study.

For the evening we met some other locals in a robot themed caffee, which has events like 'speak like a pirate day' and 'towel day'. It also sells donuts as well as donut holes! Unfortunately we didn't stay long enough to get a chance to try the latter.

We moved on to the university where one of our friends works. In the computer lab we continued working on the email-task manager, discussion structural questions on the white and blackboards.

Author :mbaehr   |   size :1440Bytes   |   Publish Date :Mar/27/12/18:02   |   to Top

Because some have to travel far to get here we start at 10am. The team is split up with two people working on the sTeam integration, one to continue to work on the interface, with my assistance, and one to disappear in another room to go into introspection mode and analyse user stories related to email and task management and come up a workflow and design based on this. Later in the week we will compare the two approaches and see if we can improve each others results.

For the evening we went out to a different area in xiamen where we had some grilled duck in a clay pot with lots of ginger.

Author :mbaehr   |   size :628Bytes   |   Publish Date :Mar/27/12/17:52   |   to Top

Punctual at 9am in the morning the rest of the group arrives and we start discussing ideas. The main ideas were already presented: analysing e-commerce, product wiki and email-task-manager.

The most interest is clearly on the email-task manager.

So we go over the basic idea and then head out to lunch. we are somewhere away from the city so two taxis are needed transport us all to a place where we can find restaurants and also the meeting place for event in the afternoon. Aftr lunch we go shopping for a whiteboard. The local walmart doesn't have any big enough, but one of us lives in this area and knows a shop that has a large whiteboard.

In the afternoon we join a meeting of the techclub in the at-cafe. An initial impression makes this place look more open and flexible than the garage cafe in beijing, but that impression is soon corrected. It may have been the more youthful audience here that misled us. Everyone is required to pay 30rmb whereas in the garage cafe this rule is not enforced.
The internet is available via a service that requires one to hand over your weibo id. No luck if you don't have one.

As the room fills up the bartender announces that the first 10 minutes of the event is networking time. Noone networked with me, so i consider that a failure. The first talk is described to me as boring and lengthy. No matter, i concentrate on reading a book as part of the research for developing the task-email manager.

In the break we use the opportunity to quickly describe the project we are doing. The audience pays attention and people even give feedback agreeing with the basic problem.
During the next talk i am asked outside to meet a couple from sweden who is heavely involved in the drupal community.

Dinner is taken at a small fast-noodle joint. And then we split in two groups, one which heads back right now, and one to go shopping for snacks and other things we may need.
By the time the second group gets back the first group already has a structure of frames that can move around, allowing tasks to be structured and reordered.
So much that we are able to dive into the first attempt at sTeam integration the next day which we initially had scheduled for tuesday.

Author :mbaehr   |   size :2393Bytes   |   Publish Date :Mar/26/12/08:35   |   to Top
An apartment near the beach
6 people
One week
One goal

After a long ride from beijing we arrive in xiamen in the afternoon. The first destination is a shack where we intended to stay and work. We settle there while we wait for the others to arrive so we can head to dinner together.

We are in the center of old xiamen with plenty of eating places nearby. a small joint is picked and we cramm into the storage closet which has the largest table in the restaurant. After a quick dinner we move to the shack to plan for the rest of the week.

Starting with a round of introductions everyone presents their motivation and goals. The discussion turns into the merrits of open-steam before we break it off and decide to move to the apartment where some of us will stay.

It is a new complex near the coast, and a brand new apartment, in the final stages of renovation. On the 10th floor, with a sea view, from the bathroom. With three small bedrooms it is just large enough for this group. Because of the distant location and also because there is enough space for most of us, we decide to work here instead of the shack in the city center.

Author :mbaehr   |   size :1245Bytes   |   Publish Date :Mar/26/12/08:27   |   to Top