Shared Components

As we identify components which are shared across different tools, we’ll add them to the list for specific design consideration. The aim is to design the components in such a way that they can work functionally and stylistically across the variety of use cases for the tool.

Shared Layouts

 

Feature/ Component

User Story

Species Selector

Seeding Rate Calc

AB Test Priority

Map/ Site Selection

As a user, I want to pick my state, plot out my land, and enter details about my land so that the tools know my specific situation.

Screen Shot 2024-05-15 at 9.08.08 AM.pngScreen Shot 2024-05-15 at 9.09.54 AM.pngScreen Shot 2024-05-15 at 9.11.00 AM.png

Screen Shot 2024-05-15 at 9.09.07 AM.png Screen Shot 2024-05-15 at 9.10.33 AM.png Screen Shot 2024-05-15 at 9.11.31 AM.png

High

Navigation

As a user, I want a display that shows what my past steps are, what my next steps are, and provides key navigation options like restarting, jumping between steps, or moving forward.

 

Screen Shot 2024-05-15 at 9.13.40 AM.png

 

 

Screen Shot 2024-05-15 at 9.13.59 AM.png

 

High

List View / Plant Thumbnails

As a user I want a list of crops I have selected so that I can explore them.

Screen Shot 2024-05-15 at 9.47.31 AM.png

Screen Shot 2024-05-15 at 9.49.08 AM.png

Low

Buttons

 

As a user I want a clear and consistent set of buttons that I know I can interact with, and look selected if I’ve clicked them already.

 

Screen Shot 2024-05-15 at 9.59.25 AM.png

 

Screen Shot 2024-05-15 at 9.59.09 AM.png

Low

Tooltips

As a user I want to know where I can find tooltips and for them to have a consistent look and feel.

Screen Shot 2024-05-15 at 10.15.28 AM.png

Screen Shot 2024-05-15 at 10.15.54 AM.png

Low

Scrolling / Paging / Collapsable Info Displays

As a user, I want to see a lot of information at once without getting overwhelmed or having to dig for it.

vs

As a user, I want information presented to me step by step so I can stay focused on the choice at hand.

 

Screen Shot 2024-05-15 at 1.08.57 PM.png

 

 

Screen Shot 2024-05-15 at 1.09.18 PM.png

 

High

Planting Window Visualization

As a user I want to know my planting window so that I can use that to inform my decisions.

Screen Shot 2024-05-15 at 1.13.01 PM.png

Screen Shot 2024-05-15 at 1.13.28 PM.png

Medium

Styling

Tool

Fonts

Colors

Species Selector

Roboto, Helvetica, Arial

 

 

 

 

 

Seeding Rate

Roboto, Helvetica, Arial