|
1 | 1 | export const meta = { |
2 | 2 | title: 'Lemon Squeezy', |
3 | 3 | image: require('./1.png'), |
4 | | - imageAlt: "Screenshot of the Lemon Squeezy home page. The header contains the Lemon Squeezy logo and site navigation, as well as 'Sign In' and 'Get started' buttons. On the left side of the screen is a short description of the product and a user testimonial. On the right is an image of a person sat cross-legged with a Lemon Squeezy laptop on their lap.", |
| 4 | + imageAlt: "Screenshot of the Home screen in the Lemon Squeezy app. To the left is a menu showing the different areas of the app, and to the center and right is a dashboard with charts relating to the Lemon Squeezy store being demoed here. Charts can be filtered by date. For each chart, three’s a purple line for the selected period and a pink line for the previous period. Above each chart is the current value for the shown metric and below, in grey, is the metric of the previous period. A badge next to the metric shows the percentage change in green for a positive change and red for a negative change. Hovering the chart shows the metrics at that specific time in a little card.", |
5 | 5 | url: 'https://www.lemonsqueezy.com/', |
6 | | - date: '2022-09-30T00:00:00.000Z', |
| 6 | + date: '2022-12-19T00:00:00.000Z', |
7 | 7 | ogImage: require('./og.jpg'), |
8 | 8 | tech: 'Tailwind CSS, Laravel, Vue', |
9 | | - description: 'Lemon Squeezy is an all-in-one platform for software businesses, covering payments, subscriptions, tax compliance, digital downloads, licensing, email marketing, and a few other things. The Lemon Squeezy app is built using Laravel and Vue. Both the website and app use Tailwind CSS.', |
| 9 | + description: 'Lemon Squeezy is an all-in-one platform for software businesses, covering payments, subscriptions, tax compliance, digital downloads, licensing, email marketing, and a few other things. The Lemon Squeezy app is built using Laravel, Vue, and Tailwind CSS.', |
10 | 10 | } |
11 | 11 |
|
12 | 12 | <Intro title="An all-in-one platform for selling digital products online."> |
13 | 13 |
|
14 | | -Lemon Squeezy is an all-in-one platform for software businesses, covering payments, subscriptions, tax compliance, digital downloads, licensing, email marketing, and a few other things. The Lemon Squeezy app is built using Laravel and Vue. Both the website and app use Tailwind CSS. |
| 14 | +Lemon Squeezy is an all-in-one platform for software businesses, covering payments, subscriptions, tax compliance, digital downloads, licensing, email marketing, and a few other things. The Lemon Squeezy app is built using Laravel, Vue, and Tailwind CSS. |
15 | 15 |
|
16 | 16 | </Intro> |
17 | 17 |
|
18 | | -<Image src={require('./2.png')} alt="Screenshot of a call-to-action section on the Lemon Squeezy website. The section contains a 'Get started' button and an image of a tablet with the Lemon Squeezy dashboard on its screen." caption="A call-to-action section using an iPad to show a screenshot of the Lemon Squeezy product." /> |
19 | | -<Image src={require('./3.png')} alt="Screenshot of the 'Create your store' section of the Lemon Squeezy website. The section contains an example of a ecommerce website that user's can build with Lemon Squeezy." caption="Section of the homepage showing what a Lemon Squeezy store looks like. The screenshot is presented in a browser window." /> |
| 18 | +<Image src={require('./6.png')} alt="Screenshot of the login screen for the Lemon Squeezy app. The screen is split in two, 50/50. To the left is a login form and buttons to sign in with Google and Twitter. To the right is a colorful background with the familiar Lemon Squeezy color patterns of drops and circles. In the middle of the section is a testimonial from a Lemon Squeezy customer." caption="The login screen for the Lemon Squeezy app, with rotating testimonials on the right-hand side." /> |
| 19 | +<Image src={require('./3.png')} alt="Screenshot of the Lemon Squeezy store designer. To the left is a sidebar menu with various settings for the store that can be toggled on/off. To the center and right is a live view of what the store looks like embedded in a fake browser window. There are also buttons to preview and publish changes." caption="The Lemon Squeezy store designer, where you configure your hosted storefront." /> |
| 20 | +<Image src={require('./5.png')} alt="Screenshots of a demo store on Lemon Squeezy. At the top are a header image and store logo. Below the header are the store name and a subtitle. Below the title is an email capture with a subscribe button. Finally, there’s a 3-column grid listing the products." caption="An example Lemon Squeezy hosted store, with an email capture and a list of products." /> |
20 | 21 |
|
21 | | -<Mobile caption="The Lemon Squeezy website experience on mobile devices."> |
22 | | - <Image src={require('./4.png')} alt="Mobile screenshot of the Lemon Squeezy home page. The header contains the Lemon Squeezy logo, a menu button, and a 'Get started' button. Below the header is a short description of the product and a user testimonial." /> |
23 | | - <Image src={require('./5.png')} alt="Mobile screenshot of the 'Join your fellow creators' section on the Lemon Squeezy website. The section contains a 'Get started' button and a user testimonial." /> |
24 | | - <Image src={require('./6.png')} alt="Mobile screenshot of the 'We’re here to help' section on the Lemon Squeezy website. A mockup of a book is shown with a short description and a link to 'Grab your free guide'." /> |
| 22 | +<Mobile caption="The Lemon Squeezy app and store experience on a 375-pixel wide mobile device."> |
| 23 | + <Image src={require('./7.png')} alt="Screenshot of the Home dashboard on a 375-pixel wide mobile device. The menu is collapsed and can be expanded by clicking the sandwich icon. The charts are listed in a single column on the narrow screen." /> |
| 24 | + <Image src={require('./8.png')} alt="Screenshot of the Products page with a list of products on a 375-pixel wide mobile device. Products are listed in a table with basic information and revenue metrics. The table can be scrolled sideways as it doesn’t fit in the viewport." /> |
| 25 | + <Image src={require('./9.png')} alt="Screenshot of a Lemon Squeezy demo store on a 375-pixel wide mobile device — the only difference between the mobile and desktop versions is that products are shown in a single column on the narrow screen." /> |
25 | 26 | </Mobile> |
26 | 27 |
|
27 | | -<Image src={require('./7.png')} alt="Screenshot of the 'We’re here to help' section on the Lemon Squeezy website. A mockup of a book is shown on the right side of the screen with a short description and a link to 'Grab your free guide'. Below that is mention of Lemon Squeezy swag that is 'Coming soon'. On the left side of the screen is a collection of decorative circles with images inside them: a typewriter, a phone, and some people." caption="A feature section with art on the left side and content on the right side. The content section contains two call-to-actions styled as two separate cards." /> |
28 | | -<Image src={require('./8.png')} alt="Screenshot of the roadmap page on the Lemon Squeezy website. The roadmap is arrange in three columns labelled 'Now', 'Next', and 'Later', from left to right. Each roadmap item has a short description and a tag such as 'Improvement'." caption="On the roadmap page, the Lemon Squeezy roadmap is presented in three columns: New, Next, and Later." /> |
| 28 | +<Image src={require('./2.png')} alt="Screenshots of the Products page with a table view of products with basic information and revenue metrics. Above the table is a search field to filter the products. To the left is a sidebar menu with the Store section expanded and Products being the active page." caption="A table view of products in the Lemon Squeezy app, including basic sales and revenue metrics for each product." /> |
| 29 | +<Image src={require('./4.png')} alt="Screenshot of the Integrations page, a subpage under Settings, in Lemon Squeezy. There’s a list of 3 apps, Mailchimp, ConvertKit, and Zapier, and the Mailchimp app is marked as “Connected.” Above the list is a horizontal menu showing the different settings pages. To the left is a sidebar menu with the Settings section expanded and Integrations being the active page." caption="The Integrations settings page showing a list of available apps to connect to Lemon Squeezy." /> |
0 commit comments