Enode Developers

Day-to-day use

Since smart charging intercepts the default charging behavior your users are familiar with, clear communication and structured information is key to ensure they can always stay on top of their vehicle’s charging.

Key events and questionsCopy link

Download

In day-to-day use, smart charging is as easy as plugging in a vehicle at a charging location and returning to it fully charged by the desired deadline, knowing it charged when prices were the lowest. However, since smart charging intercepts the default charging behavior users are familiar with and takes control of charging the vehicle, the need for information increases. To decide which pieces of information are relevant at which times, it could be helpful to split up the daily use pattern into three main events.

  1. Before plugging in the vehicle
  2. After plugging in the vehicle
  3. After the deadline has passed

Depending on which of these the user finds themselves in and the state of smart charging, they might be wondering...

  • What is the current state of charge?
  • Why is my vehicle charging or not charging now?
  • When will or did my vehicle start or stop charging?
  • How can I start or stop charging?
  • How can I change the deadline?
  • How much will or did I save via smart charging?
  • Is everything working as expected? If not, how can I fix it?

Answering these questions in your UI requires data and actions from various API endpoints relating to the vehicle, smart charging for the vehicle, and registered charging locations. By design, our APIs relay all relevant information in a universal way to cater to many different use cases. This gives you the freedom to structure, prioritize and filter the information in a system that suits your use case.

Providing too much information could make it complex and confusing to parse. Providing too little could leave users in the dark without a sense of control. Combining the main events and questions listed above with your user research and target audience knowledge could be an excellent place to start striking this balance for your product.

Example system and structureCopy link

Download

Putting the principles and considerations from the previous section into practice, we could create a system consisting of 3 parts.

  1. Vehicle information — Always relevant information covering reachability, state of charge, charge status, and location.
  2. Smart charging control + information — Always relevant control for deadline, contextually relevant information about CONSIDERING and PLAN:* states, and contextually relevant plan details.
  3. Charge control — Always relevant, contextual charge control.

With this system in mind, a view can be structured with the following logic...

  • The vehicle information A is placed at the top of the view to ensure it is always visible when entering the view.
  • The smart charging control + information B is placed just below so it can be reviewed together with the vehicle information A in a container with flexible height allowing for other relevant content like charging statistics to surface when there is no plan present.
  • The charge control C is placed at the bottom of the viewport, fixed and floating on top of the rest of the content, ensuring it is always available even if the content below is scrollable.

EndpointsCopy link

To build out this complete structure, a variety of different endpoints are used. In the examples below, we refer to these endpoints by their shortname as specified in the list below.

Shortname Endpoint

consideration.*

/vehicles/{vehicleId}/smart-charging-status: consideration

While in the CONSIDERING state, the value is populated with all of the consideration flags in their current state. Is null when in DISABLED or PLAN:* states.

vehicle.*

/vehicles/{vehicleId}

Returns the latest cached full vehicle object.

action.*

/vehicles/{vehicleId}/charging or /vehicles/actions/{actionId}

Controls charging for the vehicle, or returns the current state of the requested action.

status.*

/vehicles/{vehicleId}/smart-charging-status

Returns an object containing all information about smart charging for the current vehicle, including state, the consideration object, the plan object, the externalStart object and more.

plan.*

/vehicles/{vehicleId}/smart-charging-status: plan

While in the PLAN:* states, it returns all of the information about the current smart charging plan. Is null when in the DISABLED or CONSIDERING states.

policy.*

/vehicles/{vehicleId}/smart-charging-policy

The current smart charging policy for the vehicle.

Vehicle informationCopy link

Download

This component aims to reflect the vehicle information relevant at the current time into an easily scannable system consisting of 3 parts.

Under the hood, it combines reachability, plugged-in state, charging state, state of charge, upper charging threshold, location, charging locations, smart charging considerations, and smart charging states.

State of chargeCopy link

Download

A reflection of the current state of charge focused on the current battery level as the primary visual attention point, with the current range remaining treated as secondary information. The graph visualizes the current battery level and subtly indicates protective charging and upper charging thresholds.

Reference Description

1 Current battery level

vehicle.chargeState.batteryLevel

The percentage of battery charge left

2 Current range remaining

vehicle.chargeState.range

The estimated range remaining, in kilometers

3 Upper charging threshold

vehicle.chargeState.chargeLimit

The maximum charge threshold for the vehicle

4 Protective charging threshold

vehicle.smartChargingPolicy.minimumChargeLimit

The protective charging threshold used by the hasChargeAboveThreshold flag as part of the CONSIDERING smart charging state

5 Upper charging threshold

vehicle.chargeState.chargeLimit

The maximum charge threshold for the vehicle

6 Current battery level

vehicle.chargeState.batteryLevel

The percentage of battery charge left as part of the graph

Charging statusCopy link

Download

The current charging status is represented as a single status pill. Each status has an icon and label representing the current state. The statuses are grouped by colors reflecting if the vehicle is charging, not charging, or transitioning between the two. This can be read as a hierarchical system from top to bottom, easily translatable into an if statement.

Visual Key(s)

A light gray charging status pill with an icon (crossed over wifi symbol) and a label ("not reachable")

!vehicle.isReachable

The vehicle is not reachable

A light gray charging status pill with an icon (crossed over plug symbol) and a label ("not plugged in")

!consideration.isPluggedIn

The vehicle is not plugged in

A light gray charging status pill with an icon (crossed over lightning symbol) and a label ("not charging")

!consideration.isCharging && consideration.isPluggedIn

The vehicle is plugged in but not charging

A light gray charging status pill with an icon (full battery symbol) and a label ("fully charged")

vehicle.chargeState.isFullyCharged

The vehicle is fully charged, meaning the batteryLevel is the same as the chargeLimit (i.e., 80% of 80%)

A charging status pill with an icon (pause symbol) and a label ("charging paused")

plan.state = PLAN:EXECUTING:STOPPED || plan.state = PLAN:EXECUTING:STOPPED:AWAITING_PRICES

A smart charging plan has been generated, and charging was successfully stopped

A light gray charging status pill with an icon (loading symbol) and a label ("stopping charging")

plan = null && action?.kind = STOP && action?.state = PENDING

Charging is being stopped outside of a smart charging plan

A medium gray charging status pill with an icon (loading symbol) and a label ("starting charging")

plan = null && action?.kind = START && action?.state = PENDING

Charging is being started outside of a smart charging plan

A medium gray charging status pill with an icon (loading symbol) and a label ("pausing charging")

plan.state = PLAN:EXECUTING:STOPPING

A smart charging plan has been generated, and charging is being stopped

A medium gray charging status pill with an icon (loading symbol) and a label ("resuming charging")

plan.state = PLAN:EXECUTING:STARTING || (status.externalStart && !vehicle.chargeState.isCharging)

A smart charging plan has been generated, and charging has been previously stopped and is now starting again according to the plan

A green charging status pill with an icon (lightning symbol inside a shield) and a label ("charging"

!consideration.hasChargeAboveThreshold && consideration.isCharging

The vehicle charge is below SmartChargingPolicy minimumChargeLimit, and the vehicle is currently charging to protect the battery

A green charging status pill with an icon (lightning symbol) and a label ("charging")

vehicle.chargeState.isCharging

The vehicle is currently charging

A green charging status pill with an icon (lightning symbol with three lines indicating speed) and a label ("charging")

plan.state = PLAN:EXECUTING:OVERRIDDEN

The vehicle is currently charging

Location statusCopy link

Download

A reflection of the vehicle location and whether or not it is currently at a charging location. When the vehicle is plugged in at a charging location, it validates this for the user. When it is not, it acts as a subtle reminder of why smart charging is not currently generating a plan.

Visual Key(s)

A label stating "last seen 29 minutes ago"

!vehicle.isReachable

The vehicle can’t be reached, displaying lastSeen instead of location since the location can’t be validated

A crossed-over location symbol and a label stating "unable to fetch location"

vehicle.isReachable && vehicle.location.latitude && (now - vehicle.location.lastUpdated) >= 4 hours

The vehicle can be reached, but has not transmitted recent GPS coordinates or is not transmitting location at all

A label stating "Near Bjølsengata 54C", with the address (Bjølengata 54C) emphasised visually

vehicle.isReachable && vehicle.location.latitude && !vehicle.chargingLocationId

The vehicle has transmitted recent GPS coordinates but is currently not located at a charging location

A label stating "At Home", with "Home" emphasised visuallyvehicle.chargingLocationId
The vehicle is currently at a charging location, displayed as the name of the charging location

Smart charging control + informationCopy link

Download

This component reflects everything related to smart charging and smart charging plans. It consists of 4 main parts, where the two latter are visible only if a smart charging plan is present.

In the CONSIDERING state, it aims to present why a smart charging plan is not generated yet with helpful pointers. When in any of the PLAN:* states, it shows all details about the current smart charging plan in an easily scannable format.

Deadline controlCopy link

Download

In the main component, the deadline is written out to inform the user about their current setting. By tapping it, additional controls are presented.

Reference Description
EnabledToggles the isEnabled property and updates the /vehicle/{vehicleId}/smart-charging-policy accordingly.

Deadline

Edits the deadline property and updates the /vehicle/{vehicleId}/smart-charging-policy accordingly. If smart charging is disabled, the deadline picker could be disabled too to underline it.


Explanation textCopy link

Download

In the CONSIDERING state, it aims to present the reason why a smart charging plan is not generated yet. When in any of the PLAN:* states, it summarises the key information from the plan details that are most relevant for the current state.

The table exemplifies which combinations of CONSIDERING flags and PLAN:* states we think you could display unique texts for. It can be read as a hierarchical system from top to bottom, aiming to present the most vital information not covered by other components. It pairs with vehicle information, the charge control, and the rest of the smart charging component to paint the complete picture.

ConsideringCopy link

Key(s) Description

!consideration.singleUser

Smart charging cannot be enabled because the vehicle is linked to two user accounts.

!consideration.isPluggedInA smart charging plan will be created once you plug in your vehicle at a charging location.

consideration.isPluggedIn && !consideration.isCharging

Your vehicle needs to be charging for a few minutes to create a smart charging plan by monitoring the charge rate and estimating the required charge time. Restart charging to resume plan creation.

consideration.isPluggedIn && consideration.isCharging && !consideration.recentlyAtChargingLocationA smart charging plan will be created once you plug in your vehicle at a charging location.
vehicle.chargeState.isFullyChargedA new smart charging plan will be created once your vehicle needs to be charged.
!consideration.needsSignificantChargeCharging now since your vehicle requires less than 5% of charge.
!consideration.hasChargeAboveThreshold && !consideration.recentlyAtChargingLocationCharging to SmartChargingPolicy minimumChargeLimit. A smart charging plan will be created once your vehicle is plugged in at a charging location and the charge is above SmartChargingPolicy minimumChargeLimit.
!consideration.hasChargeAboveThreshold && consideration.recentlyAtChargingLocationCharging to SmartChargingPolicy minimumChargeLimit. A smart charging plan will be created as soon as batteryLevel passes SmartChargingPolicy minimumChargeLimit.
!consideration.hasTimeEstimateMonitoring the charge rate to create the smart charging plan. Charging will pause shortly once the plan is created.
!consideration.likelyToGenerateSavingsCharging now since delaying charging does not generate savings.
!consideration.wontStopExistingChargingSessionCharging now since delaying charging does not generate savings.

PlanCopy link

Key(s) Description
status.state = PLAN:EXECUTING:OVERRIDDENCharging now. The smart charging plan has been put on hold.
status.state = PLAN:EXECUTING:OVERRIDDEN
status.state = PLAN:EXECUTING:STOPPING
Charging now. The smart charging plan has been put on hold.
status.state = PLAN:EXECUTING:OVERRIDDEN
status.state = PLAN:EXECUTING:STOPPED
Returned to the smart charging plan. Charging will resume HH:MM {startAt} and finish before HH:MM {estimatedFinishAt}.
status.state = PLAN:EXECUTING:STOPPINGCharging will resume HH:MM {startAt} and finish around HH:MM {estimatedFinishAt}.
status.state = PLAN:EXECUTING:STOPPED:AWAITING_PRICESAwaiting next-day electricity prices before finalizing the smart charging plan. Charging will finish before HH:MM {deadline}.
status.state = PLAN:EXECUTING:STOPPEDCharging will resume HH:MM {startAt} and finish around HH:MM {estimatedFinishAt}.
status.state = PLAN:EXECUTING:STARTINGCharging will finish around HH:MM {estimatedFinishAt}.
status.state = PLAN:EXECUTING:STARTEDCharging will finish around HH:MM {estimatedFinishAt}.
status.state = PLAN:EXECUTING:FINISHED

Plan timelineCopy link

Download

Once a smart charging plan is present, and smart charging is in any of the PLAN:* states, a timeline is displayed to make it easier to grasp and scan visually.

Download

The timeline can be constructed from the plan object. In this case, the horizontal axis is created dynamically by rounding down from the time charging was paused (A) and rounding up from the user-defined deadline (D) from the smart charging policy. The charging window is visualized by the planned start (B) and stop (C) times.

Descriptor Key(s)
A Charging was pausedplan.stopConfirmedAt
B Charging planned to resume or did resumeplan.startConfirmedAt
C Charging planned to finish or did finish atplan.stopAt || plan.endedAt
D Deadlinepolicy.deadline
Download

If there has been an external start, this can be constructed by keeping track of the status.externalStart object.

Descriptor Key(s)
E Plan put on hold via charge nowstatus.externalStart.createdAt
F Returned to charge planstatus.externalStart.endedAt
Download

When the vehicle is charging according to the plan or via an external start, the charging progress can be visualized by displaying an additional marker.

Plan detailsCopy link

Download

More details about the plan are revealed or hidden by a Plan details toggle. Key timestamps are written out to add specificity to the timeline, and further details are exposed.

Download

Key details can be pulled or calculated from the plan object.

Descriptor Key(s)
A Charging was pausedplan.stopConfirmedAt
B Charging resumed at or is planned to resume atplan.startConfirmedAt || plan.startAt
C Charging did finish at or is planned to finishplan.endedAt || plan.estimatedFinishAt
D Charge time or Estimated charge timeplan.endedAt - plan.startAt || plan.estimatedFinishedAt - plan.startAt
E Estimated savingsplan.nonSmartCost - plan.smartCost
Download

If there has been an external start, details can be pulled or calculated from the status.externalStart object.

Descriptor Key(s)
F Plan put on hold via charge nowstatus.externalStart.createdAt
G Charged outside plan forstatus.externalStart.endedAt - status.externalStart.createdAt
H Returned to planstatus.externalStart.endedAt

Finished or failed plansCopy link

Once a plan reaches any of the PLAN:ENDED:* states, smart charging immediately transitions to CONSIDERING again. This component would therefore reflect the explanation text for the current CONSIDERING state before a new plan is created. For more pointers on how to handle finished or failed plan states, please refer to the respective sections below.

Awaiting price updatesCopy link

Download

If the vehicle is in the PLAN:EXECUTING:STOPPED:AWAITING_PRICES state, the plan object will have null values (as described here). This can be handled by default empty states for the plan details. The plan timeline can be visualised by outlining the possible charge window range and overlaying the estimated charge time.

Charge controlCopy link

Download

A contextual button that only shows the charge control available to the user in the moment, if any. Charge controls are available if the vehicle is reachable and is not fully charged. Which specific control type is applicable depends on whether the vehicle is currently charging or not and whether a smart charging plan is active.

Once triggered, the charging status reflects the result of the action. When charging is transitioning between states, the action button could be disabled in the state it was transitioning from until the action is completed.

Visual Key(s)

A white charge action button with a green icon (lightning) and a green label ("start charging")

(status.state = DISABLED || status.state = CONSIDERING) && !vehicle.chargeState.isCharging && !vehicle.chargeState.isFullyCharged

The vehicle is not charging and does not currently have a smart charging plan, posting an action.kind = START to the vehicles/{vehicleId}/charging endpoint once pressed.

A white charge action button with a red icon (crossed-over lightning) and a red label ("stop charging")

(status.state = DISABLED || status.state = CONSIDERING) && vehicle.chargeState.isCharging

The vehicle is charging and does not currently have a smart charging plan, posting an action.kind = STOP to the vehicles/{vehicleId}/charging endpoint once pressed.

A white charge action button with a green icon (lightning with three lines indicating speed) and a green label ("charge now")

status.plan != null && !vehicle.chargeState.isCharging

The vehicle is not charging and has a smart charging plan, posting to the /vehicles/{vehicleId}/external-start endpoint once pressed to override the smart charging plan.

A white charge action button with a gray icon (arrow pointing left) and a gray label ("return to charge plan")

status.state = PLAN:EXECUTING:OVERRIDDEN

The smart charging plan is currently overridden by an external start, posting a DELETE to the /vehicles/{vehicleId}/external-start endpoint to return to the smart charging plan once pressed.

Finished plansCopy link

Download

Once a plan is successfully finished, smart charging transitions to PLAN:ENDED:FINISHED. Like all other PLAN:ENDED:* states, it immediately transitions back into CONSIDERING to be prepared for creating a new plan once necessary.

In this example structure, the vehicle information components present the current vehicle information and smart charging state. Therefore, a plan summary for the recently finished smart charging plan is presented at the top of the view.

To fetch the required data for the summary and subsequently the detail view, you can query the vehicles/{vehicleId}/smart-charging-plans/latest endpoint.

Download

The summary consists of a title, message, and an entrance to a detailed view of the plan. Both the title and summary use dynamic values from the finished plan object.

Descriptor Key(s)
A Ended-at timeplan.endedAt
B Charged forplan.startConfirmedAt - plan.endedAt
C Estimated savingsplan.nonSmartCost - plan.smartCost
Download

The detail view for the finished smart charging plan can be constructed by re-using parts of the smart charging component used in the vehicle detail view.

After navigating back from the detail view, the previous plan summary could either be dismissed or remain in view for a certain amount of time.

Failed plansCopy link

Download

Like successfully finished plans, failed plans end in any other PLAN:ENDED:* states before immediately transitioning into CONSIDERING. Therefore, failed plans utilize a similar mechanism and structure to how finished plans are handled.

Download

The previous plan failure component consists of a title, message, and a button to dismiss it. The title states the plan was aborted, including a timestamp of when it was aborted (A). The timestamp refers to the endedAt of the failed plan.

The failure reason (B) is contextual and based on which PLAN:ENDED:* state the plan ended with and whether or not a failureCondition is present. Since the previous plan failure is presented together with the current vehicle information and smart charging state, the reasons are kept brief, as the totality of the information should paint a clear picture.

State Text
status.state = PLAN:ENDED:UNPLUGGEDYour vehicle was unplugged
status.state = PLAN:ENDED:DEADLINE_CHANGEDYou changed your deadline
status.state = PLAN:ENDED:DISABLEDYou disabled smart charging
status.state = PLAN:ENDED:FAILED && plan.failureCondition = STOP_FAILEDWe could not reach the vehicle, and charging could not be paused
status.state = PLAN:ENDED:FAILED && plan.failureCondition = START_FAILEDWe could not reach the vehicle, and charging could not be resumed
status.state = PLAN:ENDED:FAILED && plan.failureCondition = FINISHED_LATE

If you are able to send push messages to your users, you could consider notifying them of status.state = PLAN:ENDED:FAILED && plan.failureCondition = STOP_FAILED and status.state = PLAN:ENDED:FAILED && plan.failureCondition = START_FAILED.

Additionally, you could consider sending a push message for status.state = PLAN:EXECUTING:START_FAILED to notify them of potential connectivity or charger issues earlier in the plan, prompting your user to try plugging the vehicle in and out.

Putting it togetherCopy link

Download

Putting it all together, this example structure and system highlight how the key events and questions could be used to build out a smart charging experience. You can refer to this file for a complete overview of how this system handles the key CONSIDERATION and PLAN:* states.