Ice Cream on mobile
Let’s take a closer look at how all those supermarket ice cream brands fare in a mobile website competition. Here comes my ranking based on my impressions and experiences browsing their websites on my phone:
#6 Häagen-Dazs
One of the big players on the market and unfortunately a letdown when it comes to their mobile optimization. Too often (and often enough right away on their landing page) is the experience interrupted by slow loading times. Some elements provided remind me of an internet marketing 101 crash course: A hashtag suggestion is made at the bottom of the page + a live chat button leads to a separate page that first demands your credentials.
Compared to the competition, the page feels old. The navigation bar is not optimized and requires scrolling; the slow-loading product list requires endless scrolling to find a popular flavor such as vanilla; many pictures feel too big and sometimes even look cut-off on a mobile screen.
Another big marketing issue: Each flavor has its own (unmoderated) review section, filled with rather negative commentary regarding their ice cream product. I wish these reviews were at least commented by the company, this way they just serve as a product warning placed directly on the company’s page.
All in all a rather sad experience. (Time to comfort me with some ice cream...)
#5 Blue Bunny
I like how their website captures the simple design of their packaging (”it’s a blue box”) and just follows suit. Their landing page is pleasing; vibrant colors, strong contrast, not too long to scroll through.
Their navigation button pushes the page to the side and does not give a very mobile-friendly impression: Too many items in the list; grayed out and small social media buttons stuck beneath. Colorful (and bigger) variants of these buttons can be found again at the bottom of the landing page.
Unfortunately, some problems are encountered once we go a layer deeper on this page: The loading times are a tad too long; especially evident in their flavors sections. The product pictures just pop-in while the user is scrolling through this enormous list of 112 results. Why does it even need this huge catalog of flavors on mobile, why not just break them apart into different product groups?
Their whole website also struggles to present their products in an appetizing manner. I understand that it is helpful to present a product in its packaging, easily identifiable for the customer browsing this page while shopping, but let us also see what your ice cream really looks like: I am not buying it for its plastic container.
#4 Tillamook
At first glance, their mobile site is great. Well-optimized, fast load times. Fancy pictures that show each product from its best side. The glaring problem: It is all way too big.
The chosen font is huge and the pictures are not integrated into a scrolling background, which adds to the time spent seeking to find information. Many additional links (such as their links to their social media pages) are found at the footer of the page; the navigation bar icon leads only to a limited list of page links. For my taste, it takes too many touches to get to valuable information, such as the nutrition facts of their ice cream flavors.
What’s great is the fast responsiveness of the website, it invites for exploration. I love the idea of this little heart “Easter egg” button, which can be found on the top-right of many of their pages. It brings us to their dedicated fan section, with a chance to plan your visit to their creamery. How sweet!
This brand could have easily been the winner: sometimes a scoop less is more. The same goes for element sizes on websites.
#3 Ben & Jerry's
There are things to be liked about Ben & Jerry’s mobile website: it is a fast and responsive site that scales well on a mobile screen and offers a quick drop-down navigation menu that at first look is perfectly sized for a mobile experience.
However, the problems are just one touch away. Hitting any menu item transforms it into an unimaginative list of long-worded flavors, a list which also introduces an additional font to be found on this site. Scrolling further reveals a rather outdated website design, culminating in their choice to write the footer in a comic sans-like font. The whole page gives off a cheap vibe.
It’s a bold move by the company to display star ratings in their flavor overview; I doubt many people will feel convinced to give “Chocolate Chip Cookie Dough Core” a chance with its meager 1.8 out of 5 rating. Although, this may be an outlier among many other, high-rated, flavors. A positive is the presence of a little “Details” button, which may save some time for visitors who are looking for a specific service. While I do not approve their choice to hide many product pictures behind slideshow buttons (a spoonful of tasty ice cream would look great as background picture), I appreciate the easily findable ingredients list and nutritional facts. It is also smart of them to link flavor-related news/blog articles/recipes as elements on their dedicated product pages.
Overall I just feel like this brand is desperately in need of a refresh to make their brand and products look modern and delicious again. Don’t let this opportunity melt away Ben and Jerry!
#2 Breyers
I am not a fan of being greeted with pop-up messages when arriving at a landing page, especially not on mobile. While it is a nice feature to suggest delivery options in 2020, I feel like a scrolling banner would have been the better, less obtrusive, choice.
The design of the whole website is solely based on the color scheme of the logo. Unlike Blue Bunny, this choice fails to pop and lacks any form of intriguing detail, it all looks a bit boring.
But let’s talk about the positives: The page load times are decent enough and the site has one of the most optimized navigation bars: It feels very responsive, is perfectly optimized for a mobile screen size and captures the feeling of an OS through animated responses. Thumbs up also for the language selector option and buttons leading to the store pages of their mobile app. I am just surprised at their choice to hide their social media icons as small, gray buttons at the bottom of their landing page, instead of also presenting them within this quick menu bar.
While I miss tasty close-up shots on their individual product pages, I have to point out how nice it is to find a scanned image of their nutrition facts right as the second picture provided. I like their little blend summary, it gives the brand a natural feel and expresses confidence in their ingredients. I am surprised to find again a customer reviews section when scrolling on; but this time with official responses from the company itself. They must really be convinced about the quality they are offering.
All in all it is a decent mobile experience and I think the right content is there and easily findable. Somehow the bland design and lack of close-up ice cream shots just struggles to trigger my taste buds, but one can assume my appetite must be already there when scrolling their website.
#1 Halo Top
Their name gives it away, their mobile-optimized website is in fact top!
The landing page is a swift, smooth experience. The choice of color palette is soothing, it gives off a calm mood and still feels fresh and modern. The design philosophy is simple and to the point. But there are also some design choices I do not wholeheartedly agree with: Why are they hiding their social media pages behind tiny golden icons at the bottom of their site? There would be so much space for them in the prominent drop-down menu. At some instances, the font also does not harmonize with the choice of background color, the text gets lost within the page.
While their site is not rich in content (which may become an SEO problem for them down the road), it feels refreshingly fast to get to the information one may be seeking. I like how they present their flavors, it all fits neatly on a small mobile screen. It is a shame that this brand, defined by calorie count, feels the need to hide their nutrition facts and ingredients behind a small font hyperlink on each product page. It does not express confidence in the quality of the product. However, it is smart how they combine packaging and delicious serving suggestions in one (albeit deceiving) product picture.
While I am not rating their ice cream, I am going to judge their mobile optimization; this was a sweet cherry on top of my sundae.
Conclusion: None got it all right in my book. While this ranking does not represent my taste in ice cream, it surely gives a good impression on what matters to me during a mobile browsing session: fast load times, easy-to-the-eye design choices, thumb-friendly navigation and intuitive placement of information.
While this list may be controversial; let us all remember to keep a cool head and eat some more ice cream.