Project Background
SoukAI was an AI-powered B2B platform designed to connect buyers and sellers in the global energy sector, streamlining a traditionally archaic, paper-heavy supply chain. In an industry running on legacy systems and handshake deals, my challenge was to build a digital ecosystem that felt as trustworthy as a face-to-face meeting.
Role, duration and tools
The Role
Founding Designer (Product Design and Creative)
Duration
12 months
Tools
Figma, Adobe Photoshop, Adobe Illustrator, Adobe Premiere Pro, Jitter.video, Slack, Miro
Design Process
Discover
Brand strategy,
The problem,
Existing experience
Define
Persona,
Opportunities,
User stories,
Task flow
Develop
UI inspiration,
Sketches,
Wireframes
Deliver
Marketing site,
MVP,
Marketing Collateral
The Challenge: Entering "Alien" Territory
The "Outsider" Advantage
Entering this project, the Oil & Gas landscape was completely alien to me. How can I digitalise a process while not knowing how the existing traditional ins-and-outs work on paper. I had to turn this unfamiliarity into an asset. Lacking industry bias allowed me to question the status quo and view the "complex" process through a lens of simplification.
Discover: Immersion & Strategy
I ran parallel discovery tracks to understand both the Market Landscape and the User Psychology.
Brand & Market Strategy
I sat with the founders, Shoaib and Abdurrahman, to dissect the landscape and understand the visual semiotics of the industry. It was mainly dominated by heavy, dated industrial imagery. We needed a brand that felt established yet modern, striking a balance between "Silicon Valley Tech" and the "Industrial Reliability our users are comfortable with.
Discussing SoukAI as a brand with the co-founders
The Problem Space
From the product perspective, we discussed in depth the problems in the O&G space. After speaking to brokers and key stakeholders in the industry, Shoaib and Abdurrahman noticed a pattern of pains: the process was too long, there's a huge amount of paperwork, and there is an increasing risk of fraud. They made it clear that buying and selling in the energy sector is archaic. It is fragmented, slow, and heavily reliant on intermediaries.
Long, fragmented process
Oil and gas deals can take a long time to complete: New business deals in the oil and gas sector typically take 6–18+ months to close, due to complex decision-making, regulatory requirements, and multi-stakeholder approvals (Optimum7)
Huge number of documents
A huge amount of documentation makes tracking and handling more difficult and inefficient: Multiple documents are required at every stage, from early-stage transaction documents, due diligence and legal, contractual agreements, trade documents and regulatory documentation.
Fraud Risk
This complex process opens the doors to fraud: Oil and gas trading is plagued by fraud and forged documents, with lengthy, opaque processes eroding trust between buyers and sellers. Without fast, reliable verification, legitimate deals face delays, disputes, and lost opportunities.
Mapping the Current Friction
To fully grasp this complexity, I mapped out the existing, traditional offline process for an oil deal. It was a labyrinth of documentation, email chains, and manual verification steps.
Mapping the existing traditional experience. There are 10+ steps to the process if we really break it down. I also noted key friction points at each step to really hammer down what we're trying to solve.
The Opportunities
By visualising this chaotic journey, it was easier to identify the critical drop-off points where design and AI could intervene:
Long, manual process
Long lead generation; endless document signing and checking;
AI Broker
AI can reduce lead gen from 6–18+ months to a matter of seconds by finding matches based on the users' needs. It can also automate document handling.
Poor Document Visibility & Trust
Critical documents (Certificates of Origin, Bills of Lading, cargo manifests) are shared as unsecured files usually via email, and lost within endless files.
Centralised Documents
SoukAI can provide a secure, deal-specific document hub where all product and verification documents are stored, tracked, and easily referenced
High-risk decisions with little transparency
Key moments - inspections, payments, title transfers, and commissions - often happen with limited visibility. Parties rely on verbal confirmation or fragmented updates, increasing stress and risk.
Real-time deal status and milestone tracking
Each deal follows a clear, milestone-based timeline. Progress is visible to all parties, critical steps are logged, and actions are unlocked only when prerequisites are met – including an escrow payment system.
Define: The Convergence
After analysing the landscape and speaking to the founders, I synthesised the core friction points into a single guiding question to focus our design efforts.
How might we make oil and gas deals faster, simpler, and more trustworthy for buyers and sellers in the oil and gas space?
The "Trust" Strategy
I established that the Brand Identity and the User Experience had to serve this single goal for our users below:
Proto-personas:
1) Risk-Aware Buyer: A cautious oil buyer who needs clear structure, trusted counterparties, and full visibility before committing to high-value deals;
2) Efficiency-Driven Seller: A results-focused seller who wants serious buyers, fewer manual steps, and faster deal execution without unnecessary back-and-forth.
Epics & Core User Stories:
MVP Goal: Enable buyers and sellers to move a real oil & gas deal from ICPO to payment with clarity, trust, and fewer manual steps.
Task Flow
This flow reflects how a deal actually moves when it’s working. The product groups complexity into clear stages: intent, trust, agreement, and execution, so buyers and sellers can focus on decisions that matter. Behind each step, the AI handles validation, matching, and coordination, quietly removing friction from a process that’s traditionally slow and opaque. The result is a deal that feels simpler, safer, and easier to progress without changing how the industry already operates. It can be categorised as the following:
Deal request > ICPO submission and validation > Seller matching > Legal & trust setup > Terms review > Negotiation > Financial verification & contract > Payment & shipment > Post-deal documentation
Visual Identity as UX
Alongside, I also designed the logo and identity system not just for marketing, but for the interface. The color palette was selected to reduce eye strain on data-heavy dashboards while signaling stability (Trust), directly addressing the "How Might We" question.
Develop: Bridging Vision and Velocity
To turn a complex vision into a launch-ready product, I focused on three things - learning from best-in-class SaaS, rapidly iterating through low-fi exploration, and tightly aligning design with engineering for build-ready execution.
From SaaS Benchmarking to Sketches
Rather than looking at dated industrial software, I took inspiration from high-growth B2B SaaS platforms to identify how they structured complex information with cognitive clarity. I immediately translated these patterns into low-fidelity sketches, mapping out the various screens to see if modern digital patterns could simplify the traditionally dense, manual oil-trade workflow.
Dashboard
Most SaaS dashboards use sidebar navigation with a modular structure to house important, go-to content. Following a similar layout will ensure a familiar, high-end experience for the user.
AI Broker
Instead of endless email chains, Whatsapp messages or text messages, a chat interface keeps information on one platform, and keeps the experience conversational, relaxed and open – where the user has the freedom to ask anything from general queries, queries about their deals, or match-making to discover more deals. This, again, will use a familiar chatbot interface.
My Deals
Sticking to the theme of chats, I had to compartmentalise every chat to its specific deal while housing other important information associated with it also. Communication platforms do this well, but here, instead of contacts or individuals, the user clicks the relevant deal they're involved with which also reveals the relevant chat, documents and deal progress.
Browse Deals
To discover new deals manually, the user can browse through existing deals. Inspiration was taken from marketplace sites, such as Airbnb, to look at how to structure information. This can benefit users not used to that AI chat style interface in the AI broker.
Bridging Design & Engineering
To move from sketches to a buildable MVP with speed, I adopted the Shadcn design system following a strategic suggestion from our engineering team. This was my first experience working within a formal design system, and it proved pivotal for three reasons:
Design-to-Code Parity
By using Shadcn components in Figma, I ensured that what I designed was exactly what the engineers built, as the underlying code structures were already established.
Velocity
Instead of building primitive components (buttons, inputs, modals) from scratch, I focused my time on high-value UX problems like the "Deal Room" logic.
Scalability
It forced me to think systematically. I wasn't just designing screens; I was building a library of reusable patterns that ensured visual consistency across the entire platform.
Utilising a design system would allow for rapid iteration and a seamless handoff to the engineering team.
Deliver: The MVP & Marketing Ecosystem
The final SoukAI MVP was designed to replace fragmented, high-risk legacy processes with a cohesive digital service. My primary focus was shifting from the industry’s standard "data-heavy" bloat to a "Calm UI"—ensuring the platform felt faster, simpler, and more trustworthy at every touchpoint.
The Dashboard: The Strategic Command Center
The Dashboard acts as the user's entry point for speed and simplicity. By intentionally prioritising high-value "Pending Actions" and real-time "Market Price Trends," the interface reduces cognitive load and allows users to bypass the noise of raw data. This directly addresses our mission to make the start of the deal process faster by surfacing exactly what needs attention the moment a user logs in.
The AI Broker: Intelligent, Conversational Matchmaking
To bridge the gap in efficiency, I designed the AI Broker as a familiar, conversational interface that handles the "heavy lifting" of the trade. It facilitates simpler connections by using natural language queries to match buyers and sellers based on verified profiles and specific energy requirements. By transforming a weeks-long manual vetting process into a seconds-long chat interaction, we fulfilled the platform's promise of rapid, intelligent matchmaking.
My Deals: Establishing a Single Source of Truth
The "My Deals" section is where we solve the industry’s fundamental "trust gap" through radical transparency. I designed a centralised hub for every deal, linked to its own timeline of milestones (to track progress) and a repository of exchanged documents to keep files in one place. By eliminating the "black hole" of fragmented email and WhatsApp chains, this unified view ensures that every stakeholder has a clear, trustworthy record of the deal's progress and compliance.
Browse Deals: Empowering User Control and Trust
While the AI provides speed, the "Browse Deals" marketplace offers a traditional discovery layer that reinforces user autonomy. This interface allows users to manually explore the market and validate AI-driven suggestions against a broader list of listings. By providing this "human-centered safety net," the design ensures that users feel in total control of their procurement strategy, further cementing the trust required in high-stakes energy trading.
Product Demo
The Marketing Site
Agility Under Pressure: Shipping the Marketing Site in 24 Hours
This marketing site was actually created during the 'Develop' stage, while the product was still being built. With a critical investor meeting looming and less than 24 hours to establish a web presence, I worked with the engineering team to get SoukAI online.
To bypass the typical weeks-long design-to-dev cycle, we moved in lockstep:
The Workflow
The engineers selected a high-performance coded template to ensure stability. I utilised a HTML-to-Figma plugin to pull that exact framework into my workspace, allowing me to design within the technical constraints of the code in real-time.
Real-time Collaboration
As I worked to replace generic elements with bespoke SoukAI branding, curated messaging, and tailored visual assets, the engineers mirrored my changes directly in the codebase.
The Result
This hyper-collaborative "over-the-shoulder" approach allowed us to bypass traditional handoff bottlenecks. By the following morning, we had a professional, market-ready site that successfully represented our vision to stakeholders and major energy investors.
Iteration: Prototyping at the Speed of AI
To challenge my workflow, I used Lovable to rebuild SoukAI as a live coded prototype, testing the strength and scalability of the design system I had utilised.
The Workflow: AI-Augmented Building
Because the original designs were built using Shadcn, the transition to Lovable was remarkably seamless. I used my Figma high-fidelity screens as reference images for the AI with descriptive, intentional prompts; this correctly identified the components and layout structures, generating a clean, functional UI in minutes.
The Pivot: Style vs. Substance
During this rapid build, I made a critical UX pivot regarding the Deal Cards.
The Problem
In the original design, I used image previews for aesthetic "flair" to represent each commodity. However, in the Oil & Gas space, relevant images are scarce, leading to repetitive, low-value visuals.
The Solution
I iterated the cards to remove images entirely, replacing them with high-density informative content. I prioritised the "deciding factors"—volume, grade, and origin, ensuring every pixel served the user’s decision-making process.
The Result
The cards became more functional and "honest," reflecting the serious nature of the industry.
The Outcome: Full-Feature Fidelity
In under an hour, the AI had built out the Documents and Timelines tabs for each deal – features that would traditionally take days to code. This exercise proved that a well-structured design system is the perfect foundation for AI-assisted development, allowing me to move from concept to a clickable, coded URL almost instantly.
Outcome & Retrospective
This project showed how strategic design can unlock credibility in a complex, high-stakes industry. The prototype gained recognition and validated strong interest from major energy players, proving that clarity and trust are powerful drivers in B2B markets.
The Impact
The design was the engine that opened doors. The high-fidelity MVP and professional brand identity directly contributed to winning "Energy Disruptor of the Year 2025" and securing semi-finalist status at Muslim Tech Fest. More importantly, the product resonated with giants like BP, Aramco, and Turkish Petroleum, and earned the backing of OGGN, the world’s leading energy podcast network.
Some of the SoukAI team members at Muslim Tech Fest 2025; from left to right: Yaqub (Front-end engineer), Abdurrahman (Co-founder), Shoaib (Co-founder), Yusuf (Back-end engineer), Me (UX UI Designer)
Professional Lessons
While the venture eventually wound down due to a strategic shift at the leadership level, the project was a resounding success in market validation.
Mastering Complexity
I proved that I can enter an "alien," hyper-complex industry and translate it into a simple, human-centered experience.
Trust as a Metric
In B2B energy trading, design isn't just about looks; it’s about building the credibility required to move millions of dollars.
Systematic Growth
Implementing my first formal design system (Shadcn) taught me how to scale my impact and speak the language of engineering.
AI as a Tool
Using AI with image references streamlined how quickly it is to launch a live, working prototype, working between design and code.
Future Thinking and What I'd Do Differently
In a perfect world, design is driven by direct user access. In this high-stakes B2B environment, however, direct interviews with oil brokers were difficult to secure. I had to rely on the founders’ insights from their conversations with key industry players, meaning many initial decisions were based on informed assumptions.
The Challenge
Designing in a vacuum can lead to "feature creep" or misaligned priorities.
The Reflection
If I were to do this again, I would push for "shadowing sessions" or even 15-minute validation calls with the actual end-users early in the wireframing stage.
The Validation
Despite these constraints, the fact that the product received high praise from industry professionals, such as OGGN, confirmed that our strategic assumptions were on the right track, but I remain a firm believer that direct user feedback is the ultimate "North Star", which would be the ideal next step had this project continued.