Analytical website for Forex traders
How we designed and developed a regulation‑compliant Fintech product for the UK market
*We developed this project under an NDA,
so we can’t disclose its name or provide a link to the product.
Project idea
A client from the UK reached out to us and asked us to create a website that publishes reports on the performance of traders in a readable and analyzable form.
Our client planned to integrate the website with the MetaTrader platform to analyze traders’ reports. With the help of such a website, traders had the opportunity to share ideas and opinions with like‑minded professionals and seek support and guidance from renowned experts in the field.
Client’s goal
Our client's goal was to get a website to provide financial technology services to Forex traders.
On this platform, individual traders could find new connections and exchange trading strategies, while brokerage firms could demonstrate the effectiveness of trading strategies they use for their clients.
Our client wanted to launch this website in the UK market and be suitable for English Arabic, Hebrew, and Persian‑speaking users.
He planned that the website would include the functionality of Automatic performance tracking, Detailed analytics, Backtesting features, Performance comparison and social trading features.
Action plan
Design
regular and left‑to‑right layouts of the website
Develop
the website and make it reliable
Make the website compliant
with GDPR, ISO‑27001, and the Data Protection Act 2018 so it can be launched on the UK market
Features
Home screen
Some traders focus on market trends or trade around the time markets close. Therefore, the home screen includes an economic calendar showing events that impact the market, the latest news, and a clock indicating closing times for markets worldwide.
This setup provides traders with all the necessary information in one place, removing the need to check multiple sources.
Users can see trades made by their network, read posts, and share their own thoughts from the home screen.
Linking a trading account
Traders can connect their MetaTrader accounts to extract trading data for detailed analytics. Users can link multiple MetaTrader accounts to gather insights into different performance strategies used and compare them side‑by‑side.
Portfolio
A trader can analyze the performance and profitability of each trading account and strategy used.
These statistics can be shared with other traders on the platform, and brokerage companies can present them to their clients as examples of successful trading activity.
Performances search
Users can also research a list of performance strategies shared by other users to subscribe to the most successful ones.
By subscribing, users can receive updates and insights from these strategies, allowing them to diversify their trading techniques and find valuable connections in the trading domain.
Detailed view of performance strategies
When a user selects a strategy on the 'Performance Search' page, they are presented with detailed statistics.
These include a score that assesses the trader's overall skills, the number of trades, the strategy's net profit, the win‑loss percentage, risk metrics, returns, top‑performing currency pairs, and other metrics. All data is visually represented through charts and dashboards.
Performances comparison
A user can compare added performances within their profile or evaluate one strategy against those of other users to find the most suitable and successful ones.
Key metrics are used for comparison, with results visually represented through graphs and charts.
We enhanced all the statistics pages with features for convenient link sharing, so users could easily share strategies with each other or draw attention to them from other social media networks.
Blender for backtesting
With this feature, a trader can choose their own performance log strategy or a strategy provided by another user and using historical data predict how the profits would grow within a specific period.
This helps users to test different strategies without risking their money.
Social media features
Users can join discussions on forums, send direct messages, and connect with other users. These features help traders exchange insights, share experiences, and learn from each other's successes and challenges.
They also create a sense of community on the website which can increase user engagement.
Users can also see other traders’ profile pages where they can access their performances, experiences, posts, and personal info as well as send a request to connect.
Design
These were the features included in the very first version of the website. After its release, our client planned to add new features to the website.
That’s why we paid much attention to thorough planning and creating a layout that could easily accommodate changes and new features.
Mind map
At first, we designed a mind map to ensure no features were overlooked and that the created interface could be easily scaled in the future.
Design concept
We then took another preparatory step by developing a design concept to establish the visual style of the website, including the color palette and font choices.
We presented this concept to the client, and upon approval, we proceeded to build a fully‑fledged interface based on principles that we agreed upon.
Navigation
Since our client plans to scale the website, we organized the navigation into the sidebar so that new sections don’t overfill the interface. It’s a nice choice for an analytics website where users frequently switch between different data views and tools.
With a sidebar, users can move to any section of the website without extensive scrolling or switching between several browser tabs.
Color palette and typography
When designing this website we used a light color palette with a single orange accent. Such a color palette doesn’t distract the user from researching the statistics.
We also used a san‑serif font to keep numerical data easy to read.
Right‑to‑left orientation
Arabic, Hebrew, and Persian languages have right‑to‑left text orientation. In this project, we considered this in design and made sure that when users switch to these languages, the text has the correct orientation.
UI kit
Since our client planned to scale the website up in the future, we gathered a UI kit that helped us quickly enhance the website with new screens and keep the design consistent at the same time.
Development
We always help our customers to choose a tech stack that accommodates the needs of their projects.
Frontend
Together with the client, we have decided to build the frontend with Vue.js, the framework suitable for creating dynamic and reusable elements. They’re essential for displaying complex data visualizations frequently met on the website. Vue.js also allows the website to update data seamlessly and load faster which is important for real‑time market data platforms.
Backend
We chose Laravel for the backend. Our team has extensive experience with it, and during this time we have gathered a library of ready‑made solutions that help us scale the web projects faster. Laravel's MVC architecture ensures organized, scalable code. Its built‑in tools streamline tasks like routing, and database management, as well as simplified backend service development for authentication, data analytics, and API creation, all of which speed up development and reduce time‑to‑market.
PostgreSQL is an open‑source relational database management system. It is ideal for the project due to its ability to handle complex queries and ensure data integrity through ACID compliance. It allows for flexible data storage for both structured and unstructured data. PostgreSQL's processing capabilities make it suitable for managing vast amounts of data on a trading platform like this, ensuring the accuracy and availability of trading information.
Using FIX protocol
Financial Information eXchange (FIX) Protocol is a financial information protocol that provides a standardized method of data transfer between financial institutions. It transfers trade and market data with high speed and reliability.
Our customer also planned to integrate trading features into the website later. FIX would be beneficial for these features since it can enable seamless trade execution by communicating order routing and execution information between the platform and brokers or liquidity providers.
This integration helps to automate the transaction lifecycle, minimizing the need for manual intervention.
When developing this website, we used the protocol to allow the platform to receive timely and accurate pricing information from various sources. This can enhance the platform's analytics and provide users with current market conditions, which is critical for effective trading strategy analysis.
Integrating third‑party services
Data provider for economic calendar
To provide traders with data and news about events that might affect the market, we integrated Alpha Vantage, a service that provides market news and stock market data. We have changed the data provider upon request of our client multiple times to find the most accurate source of trading information.
Charting tools
The website displays a lot of data that needs to be correctly visualized. For this purpose we used Highcharts, a popular charting library that provides a wide range of customizable chart types and features, making it a great choice for data visualization.
MetaTrader
We used MetaTrader API to allow users to connect their trading accounts to the platform seamlessly for performance tracking and analysis.
Implementing real‑time updates
To ensure users receive the latest information instantly we used WebSockets, integrated with Laravel. It allows data to flow continuously from our servers to the user’s screen in real‑time. This means there's no need to wait for updates or continuously refresh the page — information is delivered as soon as it becomes available.
We enhanced the website's performance with Laravel's caching capabilities. Caching temporarily stores frequently accessed data, so it can be retrieved quickly without needing to process it repeatedly.
Making the website secure
One of the steps we take to create websites and applications compliant with GDPR, Data Protection Act 2018, and ISO 27001 is using Auth0, it’s an authentication service that complies with most security laws. This time we enable two‑factor authentication with its help. Users could complete it using an SMS code.
To protect data during transmission, we employ SSL/TLS encryption certificates, which provide robust security by encrypting data as it travels between our servers and users. For data stored on our servers, we use AES encryption to ensure it remains secure and private.
Also, the General Data Protection Regulation (GDPR) requires users to delete their data from the service whenever they want to stop using the service. To implement a feature for deleting accounts, we integrated the platform with Mailgun. The app owner plans to send users emails with which they can prove their account deletion.
At the platform, we implemented strict access control. We have established rules that define user permissions, ensuring access is granted only to specific requests and data relevant to individual user roles. This approach not only limits the number and scope of requests each user can make but also protects sensitive data from unauthorized access.
Results
We released the first version of the website in 6 months and the client tested it with the first users. Soon after the release, our client decided to turn the website into a fully‑fledged copy‑trading platform where users could trade currencies, and use performance strategies provided by other traders. The client planned to earn revenue from the website by charging a commission on transactions made through the platform.
The client was satisfied with our work and decided to keep developing the platform with us. Our collaboration lasted for 8 years and during that time the website evolved and changed almost all the time. We have added more interactions with social networks, auto trades, widgets for account management, and other tools.
6 months
Timeline
~ $55,000
Approximate price
