How to lay out content when the workflow for creating and consuming them is different?

Question

I'm doing a site that makes people write "cards" quickly. Each card contains of a title and a body.

However, the designed workflow is that the user:

1. Writes the body, listing out the detailed events
2. Quickly adds a title

With the situation, the user isn't trying to carefully plan out each step; the user needs to quickly spill out their thoughts (think brainstorming-esque) and then add a title so they can quickly scan through the information and see what each card is about.

It would make sense to have this layout:

^{download bmml source – Wireframes created with Balsamiq Mockups}

However, that seems confusing for the user to have content shift places when saved.

Even with different arrangements (read: side by side), the problem still persists: you expect to read the title first when viewing and expect to write the title last when creating. Furthermore, will a user want the title on the top when going back with modifications later (thus creating another discrepancy in the layout)?

I could still have the title last and have it bigger than the body text, but that breaks standard convention and makes the reader's eyes go up and down too much, especially when skimming through lots of information.

What's the best approach for this?

Answer 1

I think the main goal you're trying to achieve is to streamline the content creation process.

A possible solution is to split the content creation process to two mini-steps:

1. First just offering a text box to spill out thoughts, encouraging users to invest in writing (because the required investment is low)

2. Second, after the user commits (saving the card) ask her to add a title. I illustrated two options.

The upside is that you're lowering the investment barrier required from the user to start creating content, at the expense of making the entire process longer (by adding a "speed bump" in the form of a second "title" mini-step).

The best solution would be, of course, to rid the user of the need to manually add a title. Have you considered asking the user to add tags? Perhaps you're over evaluating the value of titles altogether.

Regardless of the chosen solution, try and measure. Let the data lead you to the best solution (the one where the user's abandonment rate is lowest).

Good luck.

Answer 2

A title is always expected on top. You could do something similar to Evernote. Title is inline and optional. If a user doesn't provide it, it is given a default title - Unitiled 1 Either way, the user can go back later and add the title.