User Interface and Design 

Workshop Activities Week 1-4

Workshop 1

1. What are your goals and aims – for this course, and for your career?
For this course, my aim is to apply the knowledge I gained from the lessons and activities to my current job as IT assistance , and my future career in the IT /Business industry.
2. How can an ePortfolio help? 
An ePortfolio is a great way to stand out from the rest of the crowd in terms of showing your work capability. It is different from the regular resume’s and shows your capabilities with IT and presenting yourself.
3.
So let’s start building your ePortfolio
a. What style suits your goals and aims?
Slick and simple, I want to look professional whilst adding a bit of my personality to the site.
b. What do you need to include?
Past and current work, and all my qualifications and talent.
c. How will you structure your ePortfolio?
I will structure it so that the majority of my university work is prioritized on the site, and once I am finished the course I will remove it for my personal work.
d. What do you want your ePortfolio to say about you?
I want it to describe my work ethic, and my professionalism and passion when it comes to solving problems and being a leader.


Workshop 2

For this workshop activity, we were divided into groups and given an assortment of cards. These cards were all tasks that were used in the voting process for Queensland, and in our groups it was our job to sort them into appropriate categories. I found this task to be quite enlightening on how important teamwork can be, we managed to pool our knowledge together and agree on a final outcome. 


Workshop 3

Workshop 3 had us design a a travel planning application of our choosing. Our group decided on a Contiki tour planner, aimed at students ages 18-30. Its main purpose was simplicity and usability. Knowing our age group, we wanted to keep as little text as possible aside from the essentials, so we made expandable headings that would reveal more information about a certain aspect. Large, enticing images of a destination were also critical, as pictures can speak a thousand words.

Workshop 4

Workshop 4 made us improve on our homepage for our travel application. It made us analyse our home page in regards to the design principles. We as a group decided our homepage met these criteria and added a few user friendly adjustments, such as a drag-out nav bar and logos for our headings. 

Workshop Activities Week 5-8

Workshop 5

In this workshop, we were tasked with designing a prototype for a valet service game. We had to work in groups and our aim was to create a setting for the game as accordance to the task description.

In this workshop, I learned the importance of prototyping in a design scenario. Communication was also a key element when working in a group, as everyone's concept of the design is different in their own heads. So putting a design everyone can agree onto paper was challenging, however provided a powerful insight towards how other people perceive a design. I can see myself using this scenario in my future career as a tool to help reach a general consensus on a design.

Workshop 6

Unfortunately I was not here for this workshop, but gathering from the activity, it was to design a persona based on the needs of library at Griffith uni. I’m assuming this persona has to follow a certain palette of red/white/light grey in accordance to their brand image. 

Workshop 7

In this workshop, we were tasked with designing a library interface for residents of Timbuktu on the outskirts of the Sahara dessert. This workshop was specifically enjoyable for me as I was chosen to be the librarian in charge of communicating certain design principles. I was to present the group with context of Timbuktu and the certain specifications that the interface needed in regards to the needs of the library. However they would only get this information from prodding me with the right questions. This lesson was especially enlightening for me in terms of understanding how much information could be held back in you are not prepared when coming into to a design phase. For me, in future I will make sure to be prepared with research and well thought, open ended questions to bring to a design interview.

Workshop 8

For workshop 8, we were tasked to design a block of content to make it more visually aesthetic. The content was a good page and a half of words, and it was our duty to manage it to make it presentable in terms of a web page. This exercise was interesting as it made you think and divide the content in accordance to the relevant information. Also applying principles such as collapsing headers and sub headings were deemed very useful and practical in this exercise. I found it it to be an interesting exercise as I could compare my design to other students in the class and see what elements I had they were missing and vice versa.

Workshop 9

For workshop 9 we were formed into groups and given the task of developing evaluation and testing plan for a kindergarten site. The site was http://www.hollandparkkindy.com/ and the website looked like this:

Our groups purpose was to designate a task to a user to do on the website, our group chose the task of enrolling their hypothetical child. We then chose roles in the group, I was the moderator of our group and dictated how the test would run. We had the user complete the task and I asked him a series of questions about his usability experience:

User: Tim Elliot
Time taken: 3 min 20 seconds
Clicks: 1 Click from home page
Less than 1 minute per question on form- 3 minutes to complete.

Q.1 How did you find the navigation of the site to be?
A:  Loved it, mainly because i’m an impatient person.

Q.2 Was there anything about the site you did not like when completing the task?
A. No, it was good.

Q.3 Were there too many questions in the enrollment form?
A.  Not too many, though some of the questions were a bit confusing.

Q.4 Did you find the experience enjoyable?
A. Yes, very satisfied.

From this workshop, I learned the importance of testing and how being a moderator in this testing environment plays a huge part in retrieving the information you want out of the user. I was in control of the questions to ask, and what task I wanted him to complete. From the results I could analyse certain aspects of the site and make improvement in regards to the feedback. I used this knowledge and did  a similar approach in the testing of the design brief.

Workshop 10

This workshop focused on the communication within the group, and of our design brief to our clients. The communication within our group was an interesting topic, for we have one member who isn't very fluent in English. This presents challenges in the development process as effective communication is extremely important.

Our group put up a few suggestions that could better our communication within our group, mainly all visual tools as verbal wasn't the strongest option with our current group format. Methods such as post it note maps, mind maps and general drawing were decided on as possible improvements that we could bring into our group structure. This was proven to be effective during the story boarding aspect of the development phase. 

When conveying our design brief to our clients, we chose that an interactive power point slide would be used as a prototype. This way we have all the functionality of the navigation of our game, plus the basic visual representation added. I go into more detail on the presentation below in the design brief section of this website.

Workshop 11

Workshop 11 introduced us to agile design. We were tasked with getting into pairs and creating a design. However one person had to be the driver whilst the other be the navigator. We were to chose one of three scenarios and draw a design depending on what it asked. I was paried with Matt this workshop, someone who I had worked with previously.

Matt chose scenario two; the zombie scenario. I was the driver and he was the navigator, I had to draw what he was thinking of depending on his instructions. This ended up being extremely easy, because we were both very similar people we had the same visual representation of the scanner we were supposed to draw. The dragonball scanner from Dragon Ball Z.  Using this as a reference point we both knew, the design turned out perfectly to what he visualized in his head.

Matts Scanner:                                                                                     My Scanner:

This time I was the navigator, and he the driver. I chose the Doctor Who scenario on my turn. Yet again Matt & I’s personalities clicked and we easily communicated my design based on the reference point of the Marauders map from Harry Potter. This workshop showed me the importance of communication and common reference points when trying to convey an visualization to another person. Thankfully Matt and I worked very well together and completed the task very effectively.

Workshop 12

This workshop had us analyze our classroom and its students, and design a work space that facilitated learning in groups, individually and in classes. First we had to do some analysis of the elements first by answering these questions:
• Who are your users, what are they like, and what do they need?
Our users are students, they are generally inquisitive and obedient in a classroom environment. They need tools to learn, and in this case that is access to a computer.
• What tasks do they need to be able to achieve?
Students need to do a plethora of tasks on the computer, and possible tasks requiring pen and paper such as drawing.
• What technology is readily available to support their tasks?
Students currently have apple desktop computers for completing computer related tasks and are expected to bring their own writing equipment such as a notebook and pen/pencil.
• What constraints exist on this technology and their tasks (for example,physical room layout, visibility of screens, accessibility needs etc)?
The current room layout is circular based, with the whiteboard and teacher standing out the front. This requires many students to have to turn around to see what the teacher is saying. Also students are currently stuck at a certain position due to their desktop computers being in a static position.
• Use design tools to outline your ideas (sketches, wire-frames, prototypes,mock ups etc)
My first suggestion to improve the classroom:
Every student has a tablet that they use instead of desktop computers. This gives users the ability to complete both computer related tasks as well as design tasks such as drawing. It also increases the mobility of students as they can freely move around the classroom without having to return to their desktops to show their work/ work in different groups. Microsoft Surface Pro is a great tablet for this functionality.

Second suggestion to improve the classroom:
As the classroom is structured so that it an inconvenience for some students to have to pay attention, a different layout of the classroom would an improvement. Here is a layout that I am suggesting:

This layout resembles that of a lecture theater, and will have steps on either side as well as different levels in between desks. This way students at the back can see over the students at the front. Desks will also be in a banana shape with semi-circles on either end. They are also retractable so that students can collapse the desk into a circle and work around it in groups. This paired with the tablets makes an extremely flexible and interactive classroom. 

Workshop 13

Apple Watch:
What can it do? 
Nearly all the familiar features of previous apple products, such as certain apps and has a whole new fitness functionality for athletes.
What can't it do? 
Many of the things required of a bigger screen, such as playing games, drawing and surfing the web effectively. Doing work related tasks such as note taking and spread-sheeting would be near impossible on a watch.
What opportunities does it offer for interface design?
Its convenient, light and small. Meaning it is more accessible to the user, it also offers functionality with the digital crown, which works more efficiently and with more functionality that a normal watches crown. Better and pretty much mandatory use of Siri.
How could you use this device effectively for a task? 
Scheduling your day, sending emails, receiving texts and telling the time would all be much more handy with a watch than a phone. For instance, going from meeting to meeting would be much easier with a small reminder of your wrist of when and where it is happening.
How would you design an interface for this device?
It would have to simple and intuitive, almost no texts and all icons for the home screen. Much how they have already done it. Possible a thinner and longer option would have been better in terms of usability for navigational purposes but overall they did a good job in terms of designing the interface.

Design Brief Part 1

Below is my contributions to the Design Brief:
-3. Target Audience.
-3.1 Audience Beliefs.
-3.3 Audience Demographics.
-3.4 Audience Expectations.
-5.2 Single message.

 Throughout my target audience sections, I identified the key audiences our application was aimed towards, and elaborated on their beliefs, demographic and expectations. As I previously had done marketing last year, this was right up my alley, and with sufficient amount of research and analysis, I identified two target audiences; Children (4-12) & Parents (24-40). From then it was a simple process of breaking down my audiences, and finding the key factors that make our application relevant to their interests. Fiscal’s Fraud Fiasco was born, a mini-game based learning application that teaches children the importance of cyber safety.

My single message to the audience was based off my expectations section, and that everything they expected would be fulfilled. It highlighted the key purposes of our application, as well as the values and characteristics both of our audiences possess.

Time sheet for Assignment 1

Design Brief Part 2

Below is my contributions to part two of the Design Brief:
6.1 Structural Design.

This part of the assignment focused on design principles of our application and our justification in regards to what we chose. As our target audience is children aged 4-12, the design theme would be simplicity and intuitiveness. We limited the amount of screens in our application to as few as possible, as too many screens could disorient and distract our target audience and cause them to lose engagement in our application.

However some tweaks were made to this principle, and that being because of our target audience being children. The first tweak was adding a how to screen before each mini game to explain the rules, context and aim of the mini-game. Below is a screenshot of the how to screen, and in the design brief I go into further justification as to why we implemented these screens into our application.

Our second tweak in regards to this was our addition of the end game screen, where Fiscal ( or other relevant character) voice acts the tip that the mini-game was based off. This is mainly for quality assurance as most things kids learn can go over their head. More discussion on this is shown in the design brief.

My final contribution to the structural design, was the hierarchical relationship diagram of our application. It shows the general flow and processes of how our application works and interacts within itself. I have created a key on the side to help understand how it works, I have also done an in depth justification on it in the design brief for clarification purposes.

Time sheet for Assignment 2

Design Brief Part 3

My contribution:

In part 3, I was in charge of designing part 7.1 Testing Plan for the design brief.

The testing plans purpose is to create a usability test for the users of your application. Our group took the approach of creating an interactive PowerPoint presentation that mimics the navigation and interface of our application. This was done through linking the different screens through inivisble hyperlinks over certain buttons on the images.
The PowerPoint presentation:

This PowerPoint presented a perfect way of testing the navigation of our application without the need for actually developing any software. While this is perfect for the usability testing of the menus, it doesn't take into consideration the usability for the mini-games, this must be tested separately when they are in alpha builds. With this being our approach, I then created up a list of tasks and protocols users must complete and abide by when navigating through the PowerPoint slides. The protocols were that each user must complete the specific task and then return to the menu screen when completing it. Users are all timed and their clicks are recorded for further analysis.
The test plan:

This plan measures both quantitative data and qualitative data of the user when completing the tasks. Further discussion is found on the design brief. However with this plan, we can see how effective our medium for conveying the five tips are, and hone in on improvements in regards to feedback on usability and functionality. This way we can create a more enjoyable, and better quality application for our clients & users.

When creating the plan, I had to think about what tasks I could get users to do that were a bit out of the way, in order to challenge the user in navigating our application. This was done so that we could see if the navigation of our design is as intuitive as we planned. So specific tasks such as “change the sound settings in game 1” requires them to actually go into game one and change the settings from there, instead of just hitting the settings menu on the main screen, which many of the users did. With the data collected from these results we can see where users struggle and apply revisions to increase the overall experience.

Weekly time-sheet for Assignment 3:

Contact

Thank you!

Your submission has been received!

Oops! Something went wrong while submitting the form :(

Find me on: