web book page. thinking to have a modal to display navigation and quickly jump between chapters
Linking to Explore. Goal was to link to the Explore page with something in-line with other elements but make it stand out a bit. Sharing a lot of quick iterations. My favs are the 1st and 6th ones.
Book page. Trying to keep it simple and aligned with the current designs. Width of the content had to be adjusted to retain readability for the long-form post. The rest is very simple, following structure from the Doc. I'm not sure about the top/opening part though. It's an early version and I tried to make sure there is a sign of Roadmap and OFC somewhere in the opening.
3 screenshots. Timeline, New Note, Adding Tags. White background. Not sure what note about "OFC Designs" meant exactly, happy to play more with it.
Last look and let's lock it down. Layout ready on Webflow. Gimme a green light on copy and black video and I can push it live. https://marviaca-dev.webflow.io
iOS Appstore screenshots
Would be nice to go with OFC designs. Meaning white/grey backgrounds. The create a new tag and color picker is not the same. We also don’t need to show those screens.
Landing screen, note screen and new tag screen is all we need for now. 3 screens.
Principles illustrations - do we need a new ebook cover? (edited)
Updated layout - work in progress. Should we put the screns in some flat but 3d devices from Fahredin? or would that just delay things?
Early, quick layout exploration
To make it more consistent I am thinking about switching the places. Task input always first. Project and Assignees below.
Global Task Creation. Concerns: changing projects and assignees to be displayed as 'tags' is a big change throughout the product, do we need to revisit all places it is displayed and update their look for consistency? What about tags we could introduce in the future, aren't these too similar? Is this update a move in a right direction?
Prompts sidebar
Clicking on one of the list items would open up a modal listing all related posts from other users. Clicking on the text would start a new post.
Cues in dashboard. I'm still not a fan of the naming. Julian wants to differentiate between Questions (user-generated) and Prompts (Sincere-generated), and I agree about that premise, but I want to be very careful with how deep we go with navigation. One level is enough, and keeping the table consistent throughout pages. (edited)
Playlist. A backlog-like component hosting different post ideas. Clicking on one of the options hides the Playlist, makes the Title input active and shows the post idea below the Title.
New feature images
In the first image, cutting the content like that is not preferred. Also, I wonder if we can do something interesting instead of taking exact UI components.
New feature images
These are still looking kind of too normal still. Specially the like minded people. Use our avatars for the profiles. And let's discuss on the designers call how else we can approach it.
For this, did you first collect inspiration and explored bunch of directions before landing on this?
After sync with the devs, finishing files for hand-off.
Predefined or added @users or #projects would be placed above the task. Hopefully allowing more fluid writing.
Preparing documentation for dev. I'm wondering, how do we handle text that is broken by @assignees and #projects.
Task Details Modal - Bottom details
Task Details Modal - Various statuses
Task Creation Modal - Focusing on quick keyboard input (edited)
Task Details Modal - Various iterations (edited)
I would say none feel there yet. Listed details take too much space. Assignees and project names next to each other feels also wrong. I would explore to keep things compact, yet separated. Assignees and status next to each other make sense. Task and description close to each other. Project name somewhere in between. Perhaps above task.
Most basic, initial form of a Task Creation modal.
In-line task adding iteration - controlling input with a set of commands
In-line task adding iteration
One of the iterations, focusing on a rather non-invasive (light on dvelopment) update that would allow quickly adding all most necessary details: Task name, Plan, Assignee. You can switch between all of them quickly using [Tab].
Other updates I'm working on:
(1) Task creation modal, reached with a shortcut, globally (2) Merging checkmark and status indicators (3) Expanding ‘ready for review’ status with section on Today page if assigned to a person with that status (4) Quickly adding assignees (5) Backlog - merging tasks into one, as a checklist (6) Adding directly to backlog (7) Copy+paste into checklists (?) Expanding search overlay: (?) simple commands (open create task modal) (?) consistency update - show people same way as other search result
One of the features included in Global Task Creation. Multi-selecting backlog tasks, with ability to perform bulk actions, including merging them into a new task as checklist items
Questions list component - hover state
Questions list component
After successfully authorizing with Twitter, a Question Modal would pop-up
One of the ideas I'm exploring - Asking a question as a widget.
Some early work-in-progress Roadmap design guide. We ditched that though (edited)
Exploring ideas on how to show the 3 steps approach. / 3 cards, opening in a modal with more details / step by step timeline / 3D icons/illustrations / tabs
(edited)
Using Roadmap as a base for Sincere onboarding #recycle
Cleaning up Sincere design before moving on to onboarding
Although I like the cleanliness and consistency the 2 first empty states have. There is no precedent for them to clickable anywhere. That's why a button maybe needed for the task to be clear enough?
Agreed. A button is needed. Do we have a rule when to use the filled vs outlined?
Idea on how to show Backlog onboarding video, without putting two overlays next to each other or on top of each other (edited)
Empty state layout exploration.
Similar to our “create a new project” when there’s nothing to display on workspace page, we can do the same for our empty states. Which means box it in a grey background to bring some alignment to it.
For pages we can use grey boxes. For overlays and sidebars, like our backlog, we can skip the grey box.
Today page empty state + onboarding overlay
The width of the description is too big. And in an app that is all left aligned, centered feels odd.
Can you do make iterations and upload all in a screenshot so we can pick together?
Onboarding exploration
Looking good. There won’t be any plans to choose from. We handle that in the background. So once they get access to the product, they will see a personalized plan created for them.
Also easy on shadows. ;) One layer is enough. Similar to our existing overlays. Keep in mind, a simple change in an components, means the change will applied to all places the component is used. We should be careful of these changes and only make them if it’s necessary.
Picking colors and creating assets for the Note app. Copy in progress.
