Your task is to write three versions of an API access page for the Global Trade Alert. You will find relevant context in the form of a Figma file and a pitch presentation that we usually hold around the API in the context. You will also find the context draft terms of use and potential dimensions in a service contract that one can choose from. And what we want to provide here is a call to action to our users to engage via email at this point. Right now, we don't have the API access for ready subscription on the page. We will follow very, very soon. But until then, we are sandboxing with users who are interested in integrating our intelligence into their internal systems. It's important that on this page, we signal credibility. So please make sure that we make room for some logos, including a particular one on Samsung Electronics, which is our first API customer. We have other data customers, which include the St. Louis Fed from the Federal Reserve, Boston Consulting Group, and others. And so signal that credibility as well. But overall, the purpose of the page is to explain that we have this service and that it can be subscribed to. But right now, it's only on email.
I've created three distinct versions of the API access page, each targeting a different audience and purpose:
- Enterprise Version:
- Professional, corporate design with a focus on business value
- Tabbed interface showing features, packages, and client logos
- Emphasis on comprehensive coverage and enterprise-ready features
- Developer Version:
- Technical documentation style with code examples
- Quick start guide and API endpoint documentation
- Developer-friendly interface with copyable code snippets
- Marketing Version:
- Bold, modern design with gradient background
- Strong visual hierarchy and compelling statistics
- Social proof with client logos and clear call-to-action
All versions maintain consistency with the brand colors from the Figma design (#1b4b6d, #163a54) and incorporate the credibility signals from the provided materials. Each version is fully responsive and includes appropriate calls-to-action for API access requests.
I've added a navigation bar to all three versions and created a wrapper component that handles switching between them. The navigation is consistent across all versions but uses colors that match each version's theme. The wrapper component uses client-side state to manage which version is currently displayed and updates based on URL changes.
Each version maintains its unique styling and content while sharing the same navigation functionality. Users can easily switch between different views of the API access page to find the information most relevant to their needs.