STATEWIZE
Search…
A day in your life with STATEWIZE

Planning

Morning. Coffee β˜•οΈ. Reading e-mail. Checking our Trello tickets for the current sprint:
Your tasks for the current sprint
Clearly, today is going to be busy with the task "New Onboarding (v2.1)" - in the "In Progress" column:
Ticket details
OK, great, let's see what we actually need to be working on for the new onboarding:
The onboarding journey
Awesome! We have the full picture, and how the end user's journey should look like, and how it all comes together.
Today we will be working on the "Checkout Express" step; Let's see it's attachments, check if there's any additional data there:
Preview attachments
OK so to each state, you can add files, links, and conversations. Also, comments & chats with rich markdown formatting.
Nice! This is all I need to start doing my job (be it coding πŸ‘©β€πŸ’», designing 🎨, planning ✍️, etc)

Monitoring

Now that we are done with the implementation, we just need to add some reporting in order to receive live, real-time tracking of how each of our users actually goes through this journey.
Live journey monitoring

So, when one of our users, John, will go through the new onboarding V2.1 journey - we will be able to monitor, in real time, on which step they currently are. How long each step of the journey took them to complete, and how what exactly they experienced (stuff like screenshots, logs, etc).

You will see real-time tracking on the same whiteboard you planned the journey, so you get accurate representation of how the user behaved. You can find all recorded users under User Behavior​
​
Let's "wire" our user journey with the actual product (codebase), be it an app, a web page, or backend services.
We need to start by mapping out all the things which are interesting for us to track:
  • User journey started (i.e user landed on page) [sdk.startJourney] - sent from the frontend ...
  • A certain step ("state") started - i.e "Express Checkout" [sdk.startState] - sent from the frontend
  • While on this step, the user managed to select a payment method [sdk.reportSubEvent] - sent from the frontend
  • While on this step, the user also added a shipping/billing address [sdk.reportSubEvent] - sent from the frontend ...
  • The user has finished this step (checkout fully complete) [sdk.endState] - sent from the backend ...
  • The journey is complete - sent from the backend
(please note that "sent from the frontend" and "sent from the backend" are just suggestions - it's completely up to you where you send the events from).
As you can see, you are able to monitor events to a very high level of precision.
In addition, you can attach contextual data to each of the events, resulting in rich tracking view. For example, when reporting that an "Express Checkout" has began, you may want to attach a JSON object with some data from the backend, indicating which features should be enabled, or what the customer should/shouldn't be able to do;
1
{
2
"apiContext": {
3
"mustKyc": true,
4
"requireSelfieVideo": true,
5
"customerEligibility": [
6
"visa",
7
"UK visa"
8
],
9
"supportedLanguages": [
10
"en-GB",
11
"en-US"
12
]
13
}
14
}
Copied!
It's completely up to you which data you would like to send. It will be stored in an encrypted manner for the duration allowed by your current plan.
Sending this data as part of the sdk.startState event will show you the event when monitoring this user going through this journey:
Attachments from the user's side
Meaning, when monitoring how your user experienced this specific step of the journey, you can get not only rich contextual data such as logs or JSON objects, but absolutely any files. Be it screenshots, videos, pictures, HTMLs, whatever you desire.
Sending rich attachments is great for monitoring & tracking purposes, and to provide quick superior and fast customer support. Just make sure no PII is sent, as this is subject to GDPR and such.
​
Now that our user is fully monitored and analyzed, we may want to take a step back and see how users behave in general, how they convert, etc.
All of this information can be found on the Dashboard​
​
Last modified 1mo ago
Copy link