Design Description
When a user logs in, they're directed to the Companies page. In the Companies page there is a side panel organizing all the companies into groups, and within each company there are links to the company's contacts, tasks and documents. New companies can be added directly on this page. New groups are added if necessary when a company is being created. Within each sub-item (item being contact, task, or document) of the company are buttons to add new items affiliated with that company. After clicking one of these buttons, a window will pop up where information can be entered and saved.
The other links in the navigation bar of the Companies page direct the user to a page that shows all the items that have been entered so far. For example the Tasks link will show all the tasks in a table that is sortable and filterable. Within this page a user can add a new task and link it to a company. The Contacts and Documents pages will have a similar format. To make changes to previously entered information, there will be an edit link that appears close to each item in the Contacts field, and on each Company info page. Tasks and documents can be edited by clicking on them: doing so will open a button allowing some information to be changed.
Design notes:
Instead of an extra level in the side panel tree, there could be tabs within the main panel after selecting the company. The windows that appear will be dialogs within the page, not those annoying browser based pop-ups. However, if that is hard to implement, it could be a separate page that redirects to the existing page after the window is saved or canceled.
Scenario
Task 1: Adding a company
Ann login and clicks companies.
Ann clicks +Companies and a window appears. Since she has no groups she selects New Group from the Group drop down, another window appears, she types in the group name.
Task 2: Editing a company/Adding Contact, Document, Tasks
She fills in the other information, returns which returns her back to the now populated company page. She selects contacts from the tree.
Since this is a new company, there are no contacts in it, she clicks +Contact. A new window appears.
She fills in the information about the recruiter she met at the fair and returns to the page with the contact information.
She then selects tasks, which looks very similar to the empty contacts page with just a button that says +Task. She clicks it an a new window appears.
She enters a reminder to herself to contact the recruiter, and then hits Save. She then repeats the this, but adds a reminder to apply on google's website. The window returns to the now populated Tasks page.
She then clicks the documents link under Google in the side panel and is lead to the empty documents page.
She considers using an existing document and clicks on that link, showing the Add Existing Documents window.
She view the documents that she has previously uploaded, and decided not to use any of them, and clicks cancel. Then clicks the add new document link which shows a different window.
She fills in the form, selects the File radio button and clicks the Choose File button where she finds a copy of the resume she gave to the recruiter After saving, she views that there is a list on the documents page for Google noting that she submitted the resume.
Task 3: Viewing Tasks
She then clicks the task button in the navigational bar to see if she has any upcoming due dates soon.
Seeing that the due dates for the Google tasks are soon, she logs off and starts working on the online app.