The client’s request required a broad scope, and it began with the Discovery phase. The project then continued as follows.
The Punk Panda team tasked us with designing a large crypto exchange platform with broad functionality for operations with PPM tokens. The company also wanted website redesign and development, and rebranding for its existing product.
The role of our team on this project was not only to implement solutions. The main goal was to identify these solutions during the UX research, competitor, and business analysis, such as choosing the best technologies, integrations, and even the better way for internal fees for additional monetization of the platform.
We analyzed the best competitors in the client’s field using a SWOT analysis. We conducted business analysis to find the best way to implement features and ensure that the product was profitable.
UX research is the launchpad for every project. We analyze our clients’ current products, competitors, and target audience at this stage. We then combine all these strands to create a site map and a list of UX features and improvements that can be actioned.
We conducted competitor analysis as a part of our UX research. The focus of the project was the creation and operation of a cryptocurrency. Our team came across a number of key findings which we passed on to the client.
During BA, we discovered an additional route for monetization, as our client requested. So, we explained the characteristics of the solutions we put together to our client, outlining their benefits and risks.
Based on the data from our client and the results obtained during the research stage, we created a navigation map for the app. It helped us organize the information, devise a roadmap for future developments, and scope out the work. Through a series of iterations and deep-dive exploration sessions, we clarified the vision we had in mind for the app. This allowed us to work through the details with the client, including additional clarification about UK financial regulatory constraints. As a result, we arrived at seven main flows, and we continued to work on these.
The user flow is a visual representation of the sequence of actions the user performs to achieve their goal. It is a necessary part of the process for building future steps and carrying out more work on the interface itself.
At this stage, we turn the results from our analysis into a user-friendly interface that complies with generally accepted usability rules, solves users’ needs, and makes their journey as smooth as possible.
Creating wireframes and clickable prototypes is integral when working on the design structure. It is also key to testing and improving the user journey before you proceed to the final mockup design.
This stage helps us understand the logic and structure of the future service. We create and approve prototypes for every single flow.
To determine the visual direction and style of the interface, our team creates moodboards and coordinates them with the client. This means that you can choose the most suitable solution at the earliest stage possible.
Based on the research and the direction chosen in the moodboards, we create the first visual concept of the site to demonstrate the chosen style in real conditions before we produce the finished UI design.
It is here that the magic begins. We use the moodboard and design concepts we have already produced to start bringing the project to life. We then create the UI design for the whole project and make a UI kit or design system for our developers.
PPM Token Farm for PPM-BNB LP tokens. Interaction with the custom smart contract to stake LPs for 90 days, 180 days, and 1 year, and get rewards. LPs forwarded back to the PPM-BNB pair that hosted on PancakeSwap.
PPM token staking users can stake PPM tokens for 90d, 180d, and 1y and get a reward. Interaction with custom staking smart contracts.
Swap functionality for PPM-BNB Powered by PancakeSwap BNB/PPM Pair hosted on PancakeSwap. The application interacts with PancakeSwap smart contracts to execute swap operations.
PancakeSwap subgraph real-time data. Proxy Server set up to retrieve chart data from PancakeSwap subgraph.
Liquidity management (Add/Remove) for PPM-BNB pair, powered by PancakeSwap. Interaction with PancakeSwap Router Smart Contract to add or remove liquidity.
Dashboard analytics on the rewards and last transactions in swap, farming, and staking for the user's convenience. It also allows them to track all their operations.
For this project, a custom landing page design was developed using Next.js for Front-end. The design was complicated, with animations created using Framer Motion. The multi-language Admin panel was developed on Laravel.
The Pancake.finance API was integrated for swap, stake, LP, and farming functionality. Metamask serves as a login and allows users to make operations in the Binance Smart Chain Network with BEP-20 and ERC-72 protocols. The smart contracts for the custom token and for operations with it were developed.
The graph from the Pancake platform couldn’t be parsed. To solve this, we integrated the proxy server with Redis caching.
PancakeSwap focuses on BEP20 tokens – a specific token standard developed by Binance. Since our customer's project is built on BEP20, we chose PancakeSwap.
Excellent performance in terms of load times, great SEO, scalability, and beneficial for any integration — we decided Next.js was the best solution.
Developing the multi-language admin panel and our client’s desire for security meant that we used Lavarel.
MetaMask acts as a login and allows users to make operations in Binance Smart Chain Network with BEP-20 and ERC-72 protocols.
The smart contracts integrated the custom token and operations with it.
Proxy server set up to retrieve charts data from PancakeSwap subgraph.
We are currently working on the NFT marketplace for this project.
Our team is creating the characters' NFT collection for PunkPanda and working on custom NFT Mint functionality.
We plan to add additional smart contracts to improve the platform's functionality.
The website’s development doesn’t end here. We're preparing a lot of new pages that focus on the customers' products.