There has been little time to blog about Curious Room as the past ten days or so were spent doing the final build of Curious Room. To re-cap Curious Room is an application to be purchased and run by a medium to large sized company that allows users free time every week by promoting relaxation techniques at work. Users get 5 digital tokens per month, they can use up to two per week and each is worth up to 30 minutes of free time. So the incentive for employees is to get up to 2 & 1/2 free hours to relax, the objective: to work more relaxed and thus creatively.
For my final year project demonstration on May 4th of Curious Room the build in Codeigniter makes up the the following blog post. It is a run through of how it works with one user and utililzing the use of an avatar, 5 digital tokens and logging in and logging out. A user may also change their details, avatar and leave feedback.
After getting the navigation issue finally resolved in CodeIgniter it was time to start adding some functionality to Curious Room. The seven main areas I added functionality to my project are outlined by this use case diagram:
Below is a sitemap of Curious Room. The admin is in a different colour as the administration is not the primary user of Curious Room but they would need access to record how successful Curious Room is and how often users are availing of its services.
On the main screen there are login and registration buttons: The view in the MVC part of the framework, takes data in via POST objects and sends them to the controller these are then passed to the data base. In the login example the username and password are checked and then passed back out to the controller and allow the new view of uses home page to be to be loaded to the user. The registration form takes in the user data via a form and passes this to the controller which in turn updates the data base with with the new users details.
From the first table below you can see the user Tim was added to the database.
More details on how the databases were designed and developed can be found in this blog created to highlight Creative Multimedia Programming can be found here: /http://fionakiely1.blogspot.ie/
If you look at the first use case diagram, the profile case is broken down further to a level two use case below. Another main feature of Curious Room is being able to update your details as one uses the application. After Tim has been updated you can see his new details in the second table above.
The fields are pre-populated to aid the user in selecting new details and to remind them of their old details. No validation was put on any of these functionalities as Curious Room would be used in house at a company and this is not necessary. Each user is identified by a userid and they are unique to the database so it would be impossible for a second user to repeat the same name and password as users are identified by this unique identifier. Tim1, for example has the userid of 49.
The second ‘Update User’ image is an aside, showing the URL and how CodeIgniter works with the second parameter being passed in and good for the developer to identify user 49.
After a user logs in or registers they are taken directly to the Play Choices page. In the navigation bar below note the active users Avatar and avatar name pop up to let them know they are actively logged in. This repetition is useful to the use so that they can identify with an avatar as they use Curious Room.
I will not put a lot of code in this blogpost but the users image is read into the navigation bar as folllows:<?php $this->load->view(‘nav’); as an example of how the user has been carried from screen to screen in CodeIgniter, by the use of built in CodeIgniter functionality sessions were used to ‘follow’ the data of each user after login and registration:
$user = $this->session->userdata(‘user’);
?>
These are useful ways to utilize CodeIgniter’s functionality.
On this version of Curious Room the Meditation Option can be clicked to then takes the user to the meditation page:
As you can see from the meditation page a different avatar is logged in and there are visual elements that ‘fall’ as a visual stimuli if one cannot keep their eyes closed during meditation. The ‘dots’ you see are soft moving Java Script file. A good point was made during the demonstration of this project to make the audio auto load. Perhaps in a full build of Curious Room this would be a good option and it would work well if an RFID tag was embeded in something (the logo), to be placed by the user and triggered off in a new room to listen to the meditation.
The above screen is the view for the change avatar option in the navigation bar. The images above were drawn individually in Illustrator and are .PNG files. Each avatar is part of a radio button and this is placed in a form. The image is identfied by the name field in the radio button:
<input type=”radio” name=”profilepic” id=”AvatarA” value=”1″ />
So this was a really clean way to identify the image and pull this data back to the database in the controller:
public function updateUserAvatar($userID) {
//prepare an array of user info submitted via the POST
$user = array(
“avatarID”=> $_POST[“profilepic”],
“UserID”=>$userID
);
This was difficult functionality to get working but in the end it works after the user logs back in they receive a new avatar. There was trouble with the array and it had to be pushed:
array_push($updatedUser, “avatarUpdated”);
$data[‘User’] = $updatedUser;
$this->load->view(“changeAvatar”,$data);
but alas only the message goes to the view. I will still have to find a solution for this!
The idea of being able to use a different avatar was very important. In lecture 7 of Human Computer and Cognition Ms. Farmer went into detail about modeling the human and why it is common in media with sensitive or new information. Their is evidence that people can identify more easily with unknown topics or subjects is the character are not human. This was an important part of Curious Room as this system would prompt all sorts of employees to do activities that promote creativity and relaxation. The evidence in research suggests that the person is more likely to engage if the character is an abstraction.
The secondary reason for this is simple it would allow more mystery and prevent two buddies from always meditating together as employees would be flagged by administration and encouraged to randomly use new avatars.
The about functionality is important as it provides information about how Curious Room and provides information about the different activities if employees are unfamiliar with it.
The last part of functionality to allow the user to express themselves and to help the employers get feedback is through the fun and fast feedback bar. On the first prototype it was though that a comments area would be a good idea. However, if one is meditating they are clearing their mind and leaving a long winded wordy ‘report’ of one’s experience defeats the purpose of meditating so this idea was scrapped and hence de-cluttered the screen as well as de-cluttering one’s mind.
Below, a simple visual tool made up of clouds and suns for the user to give quick feedback:
This is what the administrators page would look like:
The administrators would mainly need to see how frequently the system is being used and in a full build of Curious Room what activities are most popular.
Future considerations for Curious Room would be to get two users to use Curious Room and see who else is on line after they login:
Two users of Curious Room, for future development.
During the development of Curious Room users were involved three times. At the beginning six persons who work in medium to large sized companies filled out questionnaires to see if this was a viable project to develop. Four weeks ago the project was tested with a group of open source developers at a monthly meeting for feedback. I received advice to treat each screen as a separate product and a MVP (minimal viable product). This was nerve wracking but a great experience for my development as a designer.
The final part of Curious Room’s project development was to conduct testing. This was done with six users. The feedback was positive including comments that screens are ‘easy to use’, everything was ‘clearly marked’ and that it is a good idea. The best comment is that it is fun to use! Good suggestions regarding small font size in places and making the about screen more user friendly. This session of user testing provided valuable input and was a good way to include users at each phase of the design process.
Images of users testing Curious Room above and below.
Short video’s of user testing is also up on You Tube:
I am unsure what I will do with this project but I will spend some free time this summer keeping up new PHP skills and getting the two or more users working as I find the use of sessions interesting. I was given advice from one instructor to use a cron job so this might be looked inot. If I were to build the project again, CSS would be built with more clarity and now that I have knowledge of CodeIginier it would be built that framework in mind.
Overall it was a great experience and the last three weeks have offered me more than I could imagine in terms of learning about CodeIgniter and PHP. Overall it was very exciting when queries started working and the project started coming together and growing.
