The following case study is an opportunity for you to critique mobile usability issues in a real-life mobile learning context. Please follow the instructions and make a post on your experience at the bottom of the page.
Note: You must complete this exercise using a mobile phone, not a tablet or laptop/desktop.
Context
You are a first-year student in a visual arts program and you’re learning about colour theory. Your professor has taken you on a field trip to a local art museum and given you a mobile exercise designed to build your skill in noticing and understanding colour in art and design.
Your Task
Complete the mock student exercise and reflection below:
- Pick up your mobile phone and go to the colour palette tool on icolorpalette.com.
- Find a colourful photograph, piece of art, advertisement, or beautiful view that you think is aesthetically pleasing. It must have at least five colours in it.
- Take a moment to really look at your object. What colours do you see?
- Create a custom colour palette with five colours matching your object using the generator on icolorpalette.com on your mobile phone. You must create your colour palette by selecting/creating each individual colour by hand.
- Now reflect on your experience using our mobile usability guidelines. Did you find any usability issues on this website?
Make a Post Below
Now that you’ve completed the task, please share with us:
- What was your experience like? Describe what you thought and how you felt while trying to complete this task.
- Did you find any usability issues? How do they relate to the mobile usability guidelines?
- Bonus: Go back to the site on a tablet or laptop/desktop. How is the experience different on a different device?
35 replies on “Exercise A: Identifying Usability Issues”
I really liked this exercise. The site was quick and intuitive to use. Upload or image with URL was a single click activity, and you could even shuffle to get a further palette with your image once you’d taken it through the process.
Switching out for different images was easy.
Not much thinking needing, and lots of glee felt whilst completing the task.
No usability issues that I could find š
This website is so cool. Could be really useful for when designing a website and picking a colour palette and theme to match, painting, art activities in the class, etc… Sometimes I find that part tricky, but this site makes it easy. I found icolorpalette.com easy to navigate, only a small amount of information on the mobile site, layout was simple and clear, the list could go on. I found the site to prompt you with headings to navigate through quite quickly too. And at the end you have the choice to download your palette. Additionally, I enjoyed playing around with the “shuffle” button to find new palettes that I would necessarily choose. I will definitely use this site in the future.
This was my first time working with this website and boy was it fun… no more scrolling through colour palette websites looking at curated colours. It was super intuitive and easy to use. The layout was clean and easy to navigate. I’ll be back for more. Thanks for the share.
The website provided a good experience. The content organization was good, as it was concise, and in clear categories. There were only three categories in the menu. The navigation was clear too. There was only one problem with the layout for mobile usability in the “color palette generator” page, as it was very overwhelming with information, and choices, and once I scrolled to the bottom where the palette was created, I got stuck, and couldn’t scrolled up or move anywhere else in that page. I had to use my back button to be able to access the menu again. I did enjoyed how easy to use the color palette generator worked from a pixabay image. The experience was different in the laptop, although the “colour palette generator” worked well, the layout of the page seemed cleaner in the mobile phone.
Cool website! As a first time user, I tried it on my phone first, so overall the website hits most of the important points mentioned in the mobile usability guidelines: concise and not text-heavy, content aligned with visual elements, minimized white spaceā¦ I was able to finished the tasks assigned; however, on the Color Palette from image page, the āSelect & drag over imageā button is not quite responsive. In addition, Website color palette generator is not working properly. I tried to enter the url of my weebly website a few times, but nothing happened when I hit āGoā. The page keeps showing the facebook website color palette demo. Anyone can help with this? The color palette generator page is working fine on my laptop, but keeps freezing on my phone! I had fun generating a couple color palettes from my daughterās drawing š Thanks for sharing with us a new tool.
This was my first time using this website. It was easy to figure out and I can see myself using it more in the future! Thanks for sharing. I liked that you could create your own palettes.
Using the directions provided, I agree with Ceci this site is cool. As she mentioned icolorpalette.com is a text book example of all the key usability guidelines this OER outlines for mobile apps. The content is logically organized, easy to navigate and it is not muddled with unnecessary information and explanations. I had only two minor concerns. I also tried to load a website, met.ubc.ca/courses/ which is a colorful website but it did not work for me. It simply didn’t do anything. Now is that really a usability issue or a coding issue – I am not sure. Also, in using the Color Palette Generator to generate a new color palette for my A3 assignment website (trying to multitask) I found this tool not as intuitive for the a less artistically inclined user. The website froze often and it used icons I was not familiar with. That said, I found the palette generator from Pixabay, exactly what I was looking for! Thank you. Over all I’d give it a 9 out of 10! Thank you!
Hi Group,
From the comments above, I felt as though this was going to be an easy task. I actually had a lot of difficulty when I tried to use this site on my phone. I kept wanting to cheat and move to my desktop because of how many glitches I had. First of all, the front page was really overwhelming. I kept scrolling through more and more pallets that got lost and had to scroll back up to the top to upload an image. That aspect was easy enough. The website prompted for my permission to access my photos to upload a pic. Once that happened, I stumbled again. It asked me to “click and drag” over the image. How can you click and drag on a phone with your finger. Is this a mobile trick that I am not aware of? So I just randomly started tapping the picture and different ID numbers appeared below. I then had to download something to see my colour palette. I don’t know how big the file is and how much data that would use, good thing I was at home. I have a colour palette now, and it only has 5 colours, but what about the other colours? I tried to go back and reshuffle, but the website glitched and I needed to refresh the page a couple times to unfreeze it. I am sure there were other issues, but for the 7 minutes I spent, it was a little frustrating. I would have preferred to download an app, so that I would know that it is mobile friendly.
This was a fun task – I have never heard of this site or used anything similar. I found the mobile website to be a bit overwhelming in regards to accessibility on my phone. There was alot of content all over the page including advertisements. I also found my fingers were sometimes too big to click the right things. It was not hard to use but I did find a few issues with the layout of the content. The webpage from my computer was easier for me use.
Thank you for the activity. This was the first time Iāve used this site. It took a few times to refresh & get going on my mobile (but that was likely due to my own mobile). The content organization was concise & categorized in small groups which allowed for easy usage. I found the navigation was focussed easily on the task at hand and not distracting in any way. I think the layout could be improved slightly with less scrolling but the visual representation was clear and descriptions helped enough to make it easy to use. The overall design & layout was clear & user friendly.
I found in comparison on my laptop, just the speed was more efficient on the laptop versus my mobile (but again could be because of the year of my device)
I agree with Kristin above… I thought this would be easy but I really struggled using it with my phone! Trying to adjust a colour manually on the right would often mean that the slider bar was out of the phone screen and I couldn’t scroll over. At one point I scrolled down to the bottom of the site and couldn’t scroll back up and had to navigate back and click on the link again. It was really just a mess… I don’t know if it’s not compatible with Chrome on Android but it was basically unusable for me on mobile. I had to go back to it on my desktop to even understand how to navigate and make adjustments.
Like Megan and Kristin, I struggled to complete this task from my phone. It was difficult to scroll right and also up and down the page where the colour palettes were not scrollable. I ended up searching image palettes and kept refreshing to see the randomizer pick the different colors that were present in the image I’d picked, which was totally not the point of this exercise. The navigation is not user friendly, and the layout, although not horrible, doesn’t seem to have been optimized for mobile. The idea of the task and the website are really cool, though, and I’ll probably have more fun with it on desktop than I did on my phone. Thanks for the practical experience in identifying mobility issues!
Being colourblind, I thought this was an awesome tool to learn, as my colour matching is a little off at times. With my phone I definitely felt like there were less options, which I enjoyed. With the computer, there were more options on the screen, which was nice, but I easily got distracted, testing more things out.
I was intrigued in the beginning as I am not very artistic and thought this might be fun to play with. As a few others have stated, I also had difficulties playing around with the site on my mobile device. I found it a bit difficult to navigate around and when I tried some things out, I became a bit frustrated with the options and refreshing and then gave up and tried it out on my laptop. I did find it was easier to use on my laptop than on my mobile device. I am curious if those who were more successful may have a different mobile device (eg: newer device, brand, size etc) and if that is part of the problems with my mobility concern?
I’ve used a similar website called coolors.co to create color palletes. Comparatively, I like coolors.co better on mobile. I find that icolorpalette.com had too many options on the same page, making it difficult to select commands and navigate the page. Another thing that really bothered me is the ads. The ads on the page takes up a lot of space and it clutters the already small phone screen. They are also very distracting. Like some other people, I also found the computer version much easier to use.
This was my first time using this website. I do not know much about art and I must confess I do not know much about colors or decorating or design. So at first I was intimidated about what is this used for. I played around with the website and it was super easy to use and fun. I clicked around and even got to some Wayfair Wall Art selling color palettes. Overall I found the website easy to use. It worked fine on my phone but I have a newish phone since my old phone broke recently and I am using one of my children’s old phone (and he got a new phone).
I didn’t enjoy this website at all. There were no helpful instructions to explain how to use the website. Navigation was not user-friendly. I didn’t understand how I was supposed to use the application. It was very frustrating and a complete waste of my time.
I didn’t find this to be an easy experience initially, but once I figured out that this pallette was supposed to be downloaded and used in photoshop or similar program it made more sense. This seems like it would be easier on a desktop as actions were tiled vertically and required scrolling to view. It did have a search bar at the top and a simple radio-button menu so it wasn’t a complete mess.
I had a hard time with the site at first – I kept trying to click Create a New Palette! or Modify Color Palette – and then I realized that was a title for the section and that I should be clicking what was underneath: Random, Light, Dark, By Color, etc. I had problems scrolling if I chose one of the buttons like color shades, and it was like my screen totally locked up, and then all of a sudden I would click correctly to be able to scroll through the site again.
However, I liked that I could click the menu bar dropdown and select color palette from images. It was easy to upload my image and select different colours using the dropper, and I had fun doing this. I love that I could download the colour cards if I wanted to. I think the site needs a different landing page – the options in the menu bar are better than hunting and pecking through a randomized colour palette generator.
This experience was incredibly frustrating and I found myself wondering what I was looking at. The first thing I wanted to do took me the longest to figure out and that was choosing a basic colour. The icons used (Visual Representation) were poorly chosen in my opinion and not intuitive, and although the use of tooltip popups did help to explain what they were, tooltips work well with a mouse and poorly with a finger. Create new palette looks like a button but doesn’t do anything when you tap it (confusing).
Adding to my frustration, if I scrolled down on the page (I was using the browser Brave) it would sometimes freeze and I would be unable to scroll back up. If I tapped on the hex colour selector, the page would permanently zoom in, and even reloading the page wouldn’t reset it some of the time. The bottom of the page told me to press the spacebar!
The menu had good contrast, was well organized and was easy to find and the inclusion of a search was nice although I don’t know how you search for colour palettes and was surpised to learn there are colour palettes for dog walking!
I found myself wishing there was a very simple visual tutorial of someone demonstrating how to use this tool.
This site is really neat and I like the idea of being able to customize your own colour palettes. Overall features that are well done, like others have pointed above, are that the site isn’t text heavy, the menu is concise, and the search function at the top is easy to find. However, depending on how you use it the frustration level regarding usability changes. When I first started, I tried creating a colour palette by colour but had major difficulty selecting the colour I wanted because the scroll option was so finicky. I tried to scroll down the screen, got stuck, and then had to refresh the page. My frustration led me to explore the menu and I went to the “Color palette from Images” section where I took a photo of my artwork and it generated a list of all the colours present which I could then select from to make my palette. Way easier, but not what we had been asked to do.
I like the idea of this website however it became frustrating pretty quickly on a mobile device. I was unable to scroll and would have to refresh the page and lose the colours I had already selected. I wonder if itās the type of mobile decide that allowed some people to navigate and others not but Iām glad I wasnāt alone!
Like Kristin, I had a really hard time navigating the website using my phone. I would either not be able to scroll after changing one color or when I tried to change one color, it changed all of five of them. It also showed a drag option to expand the palettes but when I tried to do so, it got stuck and didn’t let me do it. It was very frustrating to do on my phone but when I tried it on my laptop afterwards it was significantly easier.
On my phone I had to rotate to landscape view to see all the headings on the front page. At the bottom it’s telling me to press the spacebar – but what spacebar? I’m on a mobile device. I thought I’d gotten somewhere when I double-tapped on the palette that’s automatically visible on the homescreen, but it also zoomed me in. And I can’t scroll while on that part of the screen. So no. This site was not user friendly. Or not mobile friendly at least.
I found this task to be a bit challenging. It was easy to choose my colors. However, I engaged in this activity on a mobile device so it was tough to navigate. I struggled to get the perfect color because I could āclickā as I would with a regular mouse. I also had a bit of trouble scrolling up/down. Overall I think that this color palette tool is more suitable for use on a laptop.
Very cool site!
I loved how easy it is to upload a picture, auto select a pallete and tweak if necessary.
I had a couple problems. I didn’t find the create palette by image immediately because it was hidden in the menu and once i scrolled down a little and my whole screen filled with the colours length wise and i was unable to scroll. I had to refresh the page
I was trying the color palettes from PIxabay images on my phone. The navigation is fluent. I picked up a picture. The system automatically selected five colours from the picture. There is an icon of dropper on the left side of each selected colour. When I select a colour, it showed, “select & drag over image”. However, the drag did not work on the browser. I have to click the colour and click somewhere on the image to make it work. I tried this function on my computer, it is the same: drag doesn’t work.
The idea of this website is really cool, I will definitely save it as a useful tool and recommend it to someone who may need it.
First off, I have to say that it has been quite interesting reading all of the replies before me. Some of the earliest comments had me quite confused because they talked about ease of use and intuitiveness, and I started thinking “Am I being really dense here?” as I definitely had some major struggles when I first encountered the website (and I figured the first example you’d have us try was most likely going to point out some issues…so why were others finding it so easy?). I’m glad that as I worked through the latter comments, I saw that many others had the same complaints that I had.
Ultimately, I found the site to not be very intuitive. I still don’t know how to create a pallet from scratch, and most of my interaction with the main page consisted of asking, “Can I click on this?” and “What does this do?”.
Not to sound like I’m completely incapable, I was able to upload a picture of today’s brunch, auto-generate a nice pallet, and also tweak it using the eye dropper, but I still don’t know how to do that on the main page myself, or if that’s even possible functionality on the main page. Also, as others have noted…what’s up with the reference to a spacebar?