Navigation 2.0

Target release

January 2024

Epic

https://lite-farm.atlassian.net/browse/LF-3927

Document status

DRAFT

Document owner

@ mention owner

Designer

@Loic Sans

Tech lead

@Anto Sgarlatta

Technical writers

 

QA

 

 Objective

To update the LiteFarm navigation structure to be:

  1. More internally consistent

  2. More consistent with similar farm management products

  3. Clearly categorize and demarcate interactions related to … in their own sections

    1. Managing my farm

    2. Administrating my user account

    3. Administrating the farm

  4. Initial realignment towards desktop-first experience

  5. Begin defining device break-points in the design process

 

 

 Success metrics

@Loic Sans thoughts?

Goal

Metric

Goal

Metric

 

 

 

 

 Assumptions

 Requirements

Requirement

User Story

Importance

Jira Issue

Notes

Requirement

User Story

Importance

Jira Issue

Notes

Refactor side menu to have the following menus and sub-menus:

  • Map → https://<env>.litefarm.org/map

  • Tasks → https://<env>.litefarm.org/tasks

  • Crops → https://<env>.litefarm.org/crop_catalogue

  • Finances

    • Transaction list → https://<env>.litefarm.org/Finances

    • Other expenses → https://<env>.litefarm.org/other_expense

    • Labour expenses → https://<env>.litefarm.org/labour

    • Actual revenues → https://<env>.litefarm.org/finances/actual_revenue

    • Estimated revenues → https://<env>.litefarm.org/estimated_revenue

  • Insights → https://<env>.litefarm.org/Insights

  • Documents → https://<env>.litefarm.org/documents

As a user I want each of the areas of my operation accessible to me so that I can quickly navigate through the application to my desired destination

 

https://lite-farm.atlassian.net/browse/LF-3910

https://lite-farm.atlassian.net/browse/LF-3911

https://lite-farm.atlassian.net/browse/LF-3912

Three different versions of the side menu depending on the screen dimensions, which can be seen here:

https://www.figma.com/file/eMffC0h3JPlWtzNttxJpil/Litefarm-Updated?type=design&node-id=970-22925&mode=design&t=mdbq9mdG3Zv7ZJVQ-0

Introduce “administrator actions” to side menu, with the following menu items:

  • Farm settings → https://<env>.litefarm.org/farm

  • People → https://<env>.litefarm.org/people

  • Certifications → https://<env>.litefarm.org/certification

As a FO / EO / FM I want to be able to quickly find all the administrative sections of the application so that I can effectively administrate my farm

 

 

Three different versions of the side menu depending on the screen dimensions, which can be seen here:

https://www.figma.com/file/eMffC0h3JPlWtzNttxJpil/Litefarm-Updated?type=design&node-id=970-22925&mode=design&t=mdbq9mdG3Zv7ZJVQ-0

Simplify top navigation by …

Removing:

  • Tasks

  • My farm

  • Colour gradient

 

Refactor:

  • Look and feel

  • Drop-down style by screen size

  • Icons

 

As a user I want each of the areas of my operation accessible to me so that I can quickly navigate through the application to my desired destination

 

 

Three different versions of the side menu depending on the screen dimensions, which can be seen here:

https://www.figma.com/file/eMffC0h3JPlWtzNttxJpil/Litefarm-Updated?type=design&node-id=970-22925&mode=design&t=mdbq9mdG3Zv7ZJVQ-0

Update spotlights to be consistent with Navigation 2.0 changes

 

Make sure the following spotlight correctly:

 

Remove:

 

Remove:

As a new user I want app guidance to be reflective of what I see so that I start developing understanding of how to do things in LiteFarm

 

 

 

 

Add animation for toggling full / minimal side menu

  • Should display once for all users

Initial designs on Figma as of Dec 14, 2023, @Loic Sans will finalize icon placement by Dec 18, 2023.

 

 

 

 User interaction and design

https://www.figma.com/file/eMffC0h3JPlWtzNttxJpil/Litefarm-Updated?type=design&node-id=970-22925&mode=design&t=mdbq9mdG3Zv7ZJVQ-0

 Q&A

Question

Answer

Date Answered

Question

Answer

Date Answered

What does the number next to Tasks represent?

TL;DR - Remove it from S77!

 

One proposal:

  • FO / FM / EO: Tasks due this week

  • FW: Tasks assigned to me this week

Week is the current Su - Sa period, not the next 7 days

Another idea, could just be tasks due today for the logged in user.

 

Dec 14, 2023

What about the breadcrumbs on the top bar?

TL;DR - Remove it from S77!

 

A few concerns here:

  • A lot of navigation is embedded into screens and we would need to review and refactor these screens to update navigation consistently

  • Breadcrumbs could get 3 levels deep (e.g. crop > variety > crop plan > tasks) - how to display on mobile?

Dec 14, 2023

Should we be cutting the tasks and farm settings spotlights?

TLL;DR remove both spotlights!

Kevin in favour of removing, reasoning below:

  • Tasks spotlight: This was introduced when LiteFarm switched from “activities” to “tasks” to reflect the difference in those things. After a review of many other farm management apps, I feel tasks are ubiquitous and don’t really need explanation. Further, as a side menu item they are now labelled rather than just being an icon.

  • Farm settings spotlight no longer makes sense - the prior spotlight “Farm settings”, “Farm map”, and “Employees” - these are now 3 different items in 2 different locations. Since all of the spotlighted features now have icons and the spotlight provides no additional information from the icon, I suggest removing it instead of refactoring or splitting into several different spotlights.

Also, generally don’t believe that “more” onboarding is better. I would argue that more relevant onboarding is better.

Both agree that we need more and better onboarding!

 

 

 Out of Scope

  • Breadcrumbs

  • Number next to Tasks on side menu