An online marketplace that connects gems buyers with sellers
Brand Identity Design
Web App Design
Web App Development
Landing Page Design & Development
~ 4 months
GemAsk is a new company in the market. It’s a marketplace where gems buyers’ needs are put in the first place. All they need to do is post an ad about the gem they’re looking for and wait for the seller to contact. On the other side, sellers must pay a small fee to open a chat with a buyer. It’s a small precautionary measure to make sure that the seller is serious enough and cut off those sellers who don’t have the right stone but want to start a dialogue anyway.
Our main task was to help our Client to prepare an MVP of the service. As a full-cycle agency, we helped in everything from the beginning to the end: we’ve designed a brand identity to dress up the company into a friendly and modern style. Then, we proceed to the biggest part of the project – we’ve redesigned and built the web application. And the cherry on the top is a landing page.
First step: discovery phase
Our discovery starts from discussing the brief that every client has to fill out. There we ask questions about the client’s business, goals, target audience, competitors, etc. Besides that, there is a place in the brief where the client can write down all the thoughts and wishes related to the future style. We analyze the brief, ask additional questions if needed and then we dive into competitors research. We look for different types of competitors: direct, indirect, and non-obvious ones. We analyze different parameters to find out our client’s position on the market and what should we do to stand out from the competition.
As a result, we got a detailed brief and spreadsheet divided into two target groups: buyers and sellers since the competitors in both groups are different a little bit (but only a little). This helped us to get the idea of what we what to convey with the brand identity and what direction shoud we choose to differ from the competitors.
Our goal was to design something light, relatively friendly, and easy to understand for the majority of the people who can stumble upon the GemAsk landing page or the app. The genesis of the name is pretty clear: users can ask for a gemstone. Having in mind the name, industry and the possibility to be easily recognizable, we came up with the idea of the logo that combines two main elements of the service: a gem and a chat bubble.
We’ve also created a calm color palette with strong navy blue accents and chosen a pretty good typeface – Poppins. Since this product is an MVP, we took into consideration the fact that our Client couldn’t spend thousands of dollars on fonts so we were choosing from Google fonts that are free for commercial use. Besides that, we had the idea of showing simplified gemstones as graphic elements to make the design really fit the business meaning. Also, as we always do when designing a brand identity, we finish with brand guidelines that contain all the information needed to use our design work without any problems. The basic elements of every brand manual that comes from us are logo description, logo variants, and incorrect use examples, color palette, and typography information. And, if appliable, we add the information about imagery do’s and dont’s and graphic elements examples of use.
When it comes to web app design, we always create wireframes and we did it in this project too. It’s a super important stage where we’re trying to find the best way to organize the desired functionality on the screens. Iteration by iteration, we come to the best possible way of displaying the content according to the best UX practices.
One more cool thing that we did before starting the design and, of course, before creating the wireframes: a user flow. It’s the basis of all the further design work. User flow was the best way to follow the user step by step to make requirements specification and proceed to wireframes.
Using a bunch of wireframes, we designed a high-fidelity version of the app screens for desktop, tablet, and mobile. We applied previously created brand guidelines and graphic elements to the final version of the high fidelity screens.
One of the core features is the chat between buyer and seller. It’s the place where deals are made and where users can discuss offered gemstones in detail. Since users’ rating is an important part of every marketplace, buyer and seller can rate each other after the deal is successfully made. The chat can be closed without making a deal, but that way, users can’t rate each other to avoid unfairly negative ratings.
Also, when the fee is paid and chat is open, users can visit each other profiles to see if they have any other published and active ads. It may happen that the seller has more gems that will interest the buyer.
Web App Development
Thinking of the best practices and web standards, we built the web app. Here are some details about the technologies that we’ve used in this project. For frontend development, we used our favorite framework Next.js which is a great choice for building versatile apps and websites. The deployment was happening on Vercel and we personally think that Next.js and Vercel is such a strong pair that Mr. and Mrs. Smith would be envious. For backend development we used Laravel.
Every app should have at least a landing page describing the use cases, benefits for the users, and pricing options. Since GemAsk was an MVP, there was no need for a complex website and we came up with the idea to design and build a landing page with simple instructions. Using interface elements from the app, we illustrated detailed paths for two groups of users: buyers and sellers.
During these 4 months, our team has led the project through forming the brand identity, multiple consultations, designing, and building the MVP of the service. Also, in the end, our team prepared a list of improvements that we suggest to consider in case of developing the idea.