Today I finally managed to get something working with my graphs to display a users input. I have spend a number of weeks trying to get it to work and it has driven me mad. Some of the challenges I have faced are as follows:
- first the date picker was text so we altered that field to use a date picker jquery ui – this is for ease for the user and aesthetic. We achieved this by setting the input ID to a corresponding name that we told the date picker to act upon ie ‘date picker’
- Next the issue was about pulling the variables from the form to the next page and using those in my chart – The idea was that we would need to pass the variables over a secure link otherwise we would have to store them using cookies or JSON. So, I got the user input data to store in the address bar but it wasn’t holding the number (input) as it should have been, instead it was holding a number and single speech marks e.g. ’13’. To resolve this I had to put a small line of code in to say get a substring and remove the first and last characters leaving just 13. I was then able to pull the data from the address bad and get chart.js to display it as a line graph.
- I also had a lot of duplicate code to pull the parameters from each variable. I decided to cut it down by creating a function that enables me to populate the parameter with a label e.g. ‘weight’ or ‘body fat’
- Condensing: I decided that showing individual graphs was a good idea, however, for a user to see their overall progression a simple line graph displaying a line for each element would be sufficient. The next steps involved here are to ensure that there is some sort of key to ensure that users know what each colour is representing. I will also test this out during my second round of user testing in a couple of weeks time. I will mock-up where I am, and my next intentions in ‘Sketch‘ so that I can show users a high-fidelity mock-up and get some more feedback.
I still have a lot of work to do but as it stands I am pleased with my progress. Let’s hope that it goes down well when I do my user testing…