B2B Retail App
Meron is a franchise that sells speciality coffee services. The idea behind their business is to capture the present moment, and the one thing that should be the greatest joy to people. The joy of being.
We build the new website for Meron by keeping in mind mobile device performance while giving its brand the online presence it deserves. A youthful and fun play using the brand’s bold color combination of black and bright yellow.
The challenge was to speak to its audience by telling its story and to reach new audience at the same time.
Happy Cup Animation
Meron is still in development, but below there are some screens showcasing the work so far. Looking forward to updating this section with complete flows and graphics.
The components created “mobile first” extended nicely on larger screens, thus keeping it consistent and easy to maintain.
Telfort is a Telecom business in The Netherlands providing reliable services at affordable prices. They there for everyone, especially for people who want quality, but do not want to spend too much money on it.
Description: “Kassabon” (the shopping cart summary) is an important component in the checkout flow. It’s the only section present on all 3 steps of the checkout and it helps the user keep track of their products by offering feedback during configuration and showing total costs, as well as extra information.
Goal: increase “CombiVoordeel” deals and increase channel share.
Issue: The lack of an overview and the display of too much content makes the user not complete their task of finishing the checkout process and thus prefer to call support or not complete the order at all. Main reward was the “CombiVoordeel” benefits which were not offering enough information. Previous user interviews were showing that the users didn’t completely understood what “Combivoordeel” is and needed more information to make the purchase.
Hypothesys: By offering a better overview and extra explanatory information when needed, there will be an uplift in “CombiVoordeel” deals, less overall checkout drops and less calls to customer support.
Solution: Group products in the kassabon as follows: product / extras / combivoordeel benefit / monthly costs ( before and after promotion ) / one time costs such as activation or setup. Each item becomes a collapsible element that shows extra explanatory information regarding that specific cost. Transparency in expences is a very important value that the company shares with the clients.
All the information provided here has been carefully selected based on feedback from customer support, user interviews and A/B testing. The user is offered all the information needed to make the purchase with no surprise costs. The collapsible elements help displaying information on different levels thus not overwhelming the user with information but still make it accesible if needed.
Beside the functionality the online digital sales team considered feedback from customer support in an effort to provide the answers to the most concerning questions a user might have during configuration.
A/B testing: We tested this solution and the results where showing more orders being made as well as an uplift in “CombiVoordeel” deals, which was one of the main goals that supported this redesign.
Future user interviews showed that the solution worked and therefore was extended to other flows. We even implemented a solution with collapsible elements to other sections of the website in order to better handle the content, especially on a mobile device.
The appropriate solution, tested and data confirmed, is to show the products by comparison. Telfort’s persona is very interested in getting the best quality at an affordable price. The products are therefore displayed as a comparison table making accessible at one glance all the benefits. At this stage the user is still orientating and it was interested to find out from user interviews that visitors tend to scroll when looking for information and how important it is to have the right content at the right section. For the returning visitors quick actions are provided so they can complete the checkout faster.
For the redesign we kept in mind that certain sections should be re-used across the website, so we designed them as components that can later be personalized rather than customized. This was very usefull for content managers and it also improved consistency across the pages in the shop.
The challenge on mobile devices was to find a better solution for displaying a lot of content. Focus was on reducing the scrolling on checkout pages and make the explanatory information accessible only when needed. To achieve this we designed and tested several improvements as follows:
- Collapsible elements
- Read more links
- Scroll to next step once a task/configuration is completed
- Improve content based on findings from research, user interviews and feedback from customers
Mediatic is a web agency based in Cluj-Napoca. They craft tailored websites, visual identities and offer digital solutions through effective design.
With a background of over 10 years of working in the digital business, we designed and built a template to be used for our clients as a set of deliverables, containing rules, style guides and utilities. More than just a Sketch library or Zeplin links it holds together all the components needed to start development, maintain and evolve any digital product.
“A design system is a collection of reusable components, guided by clear standards, that can be assembled together to build any number of applications. Design systems are a method to translate a consistent experience and visual language across a product when working on different touch-points.” – UX Planet.
Another aspect of a design system is sharing and accepting a way of designing and developing digital, by making a product scalable and consistent. We consider consistency to be a brand value that we teach our clients to embrace it.
Below a few screens from the developed Design System.
The typography is directly implemented when creating the design system, thus giving the first applied specifications. It also can be viewed as the first preview in its most basic form: typography and spacing.
All the content needs a place to be displayed and components offer the layout, the styling and the rules to do so, in such a manner that it’s consistent across devices and platforms. This can also be extended outside the digital world such as print.
The Design System includes prototypes to make sure the functionality is correctly implemented.
The Woman motivates, educates and supports women, those #LeadersofChange who have the power to inspire and connect businesses. Women leaders encourage education and act through active support within both their own communities and global ones.
In 2018, the conference gathered more than 700 #LeadersofChange for their 8th edition of The Woman Leadership Conference. The Woman promotes the idea of cultural and personal diversity. We are all diverse through the actions that we take, the job that we have and our aspirations. We encourage each of you to embrace your diverse personality.
The Woman Shop
The Woman Shop is an online shop selling perfume and make-up. Main audience are women. Layout was build with modular sections in mind so that elements can be used across the website. My task was to create the UI for homepage and a product page, as well as creating the branding and online presence – logo, typography, visual design.
Product page features a clean design reflecting a modern approach for the always up-to-date-woman.
The Woman Shop’s online presence extends that of the online store on several media channels such as Instagram and Facebook. A styleguide containing rules was created in order to have a consistent presence across platforms.
Instagram Concept – Proposal was to create a series of 6 posts where, beside the product, in a 6 posts grid you can present other related products, for example products associated with a perfume on promotion. Instagram posts beside it will display make-up or jewelry or books that match the perfume mood. Smells like bubble gum.
Jobus is where both companies and candidates have the opportunity to create and personalize a profile as proof of their value & strengths.
Custom Company Profile: Jobus offers an opportunity to create an image that you talk about and to convince potential employees that are ideal for their career development.
Custom jobs adds Jobus offers an opportunity to create an image that talks about your company and to convince potential employees that you are ideal for their career development.
Choosing a custom design will increase the visibility of your profile and attract the best candidates. Adding personalization is one unique offer to the market for jobs with the aim to make each campaign a success recruiting guaranteed.
Create CV, Export PDF CV,Company Ratings: Each part from your background is relevant to your future employer. Help him to meet you, creating a profile and a full CV, to highlight your experience. You can post a review of the company in which you work, and contribute to building a community based on transparency and professionalism.
Possessing a vast database of movies, actors, directors and others involved in the film world, CinemaRX offers daily fresh information from the world of film: news, trailers, box office, reviews and previews, editorials, special articles tops and much more.
The client wanted an updated version of their old logo, one that would be more appealing to the user. The logo was just the starting point in creating their online presence, new layouts, icons, improved UI/UX were all build from scratch.
Challenge of this project was to find ways to display a lot of content, thus we worked a lot on formatting the typography. We choose a condensed font that didn’t affect legibility.
In order to have a consistent layout we separated the content in sections and design each of them much as a puzzle, in order to mix and match them across the platform.
Women Mentors is a platform dedicated to educating & mentoring, to those who want to develop their career, providing direct access to the life experiences of leading women in various fields. We believe that in order to train professionals it’s needed an alternative form of education based on models offered as an example.
The platform’s purpose is to create a learning space and common development, whose primary goal is to ensure a good balance program personally and professionally, to prepare participants for future challenges but also to become people with a relevant impact in society.
Website as a digital solution to handle subscribers to benefit mentor-mentee relationships. We created 2 pages serving as landing pages for their marketing campaign on social media and events, such as the “Leadership Conference”.
To qualify as a mentor, each must take responsibility to fill the roles at the same time of a teacher, a friend, an advisor, a confidant and a role model. A mentee on the other hand must make some personal choices, be open for new experiences and engage in a professional relationship with the mentor.
Education can change people’s lives. But to make the best decisions, each needs the perspective that only the influence of successful models can offer. Here comes the role of mentors. Mentor’s page was designed on desktop to be similar to an open book, in order to keep up with the education theme and offer a sense of openness and sharing knowledge.
Every mentee has to assume a few personal choices, such as wanting to evolve professionally, be opened to new experiences, widening personal and professional horizons, spends time on interacting with the mentor and is responsive to criticism and feedback of any kind.