Speak Fluent Now

CLIENT

Me
Remote

TECHNOLOGIES

AWS Amplify & CDK
Tailwind
Next.js

SERVICES

AI Conversational Chatbot
Stripe Payment
Login & Preference Customisation

DATE

Apr 30, 2024

Speak Fluent Now

SpeakFluentNow: Building an AI-Powered English Conversation Platform

SpeakFluentNow was a personal project that used AWS Amplify, Next.js, AWS CDK, and Stripe to create an interactive environment for learning English. The platform is no longer live, but it tackled speech recognition, secure payments, and multi-language interfaces.

The Project

SpeakFluentNow let users practise English through debates, role-plays, and phrase exercises. It ran on a serverless architecture with AWS Amplify for hosting, AWS CDK for infrastructure management, and Next.js for the front-end. Stripe handled payments for added features and extended practice sessions.

The application supported multiple languages for menus, instructions, and error messages. Users could switch interfaces in real time. This approach made it easier to transition between native languages and English exercises.

The Challenges

1. Speech Recognition Stoppages

  • The Web Speech API sometimes stopped recording when users paused.
  • Many language learners take extra time to form sentences, leading to abrupt cut-offs.

2. Payment Security and Validation

  • Stripe webhooks needed signature verification.
  • Preventing duplicate payment events was crucial to avoid billing issues.

3. Internationalised Front-End

  • The platform had to support varied layouts and text directions.
  • Consistency in UX across 16 languages required careful planning and testing.

The Solutions

1. Improved Web Speech API Handling

I enhanced the speech feature with a retry mechanism. If the API stopped recording unexpectedly, the application resumed the microphone. Learners could pause mid-sentence without losing progress. Fallback strategies across browsers ensured users could still practise via basic audio capture if certain browsers failed.

2. Stripe Integration and Webhook Management

I used AWS Lambda to handle Stripe webhooks. Each event included a signature check, preventing unauthorised calls. Lambda functions stored each transaction in DynamoDB, tagging them with unique identifiers to reduce duplicate processing and simplify tracking. Sensitive keys stayed in AWS Systems Manager Parameter Store for safety.

3. Next.js Internationalisation

SpeakFluentNow used Next.js localisation features to serve different languages. I created language-specific folders for translations, ensuring the site’s layout adapted. For right-to-left languages, CSS rules adjusted spacing and alignment. Cypress tests confirmed that text overflow and layout issues did not occur when switching languages.

Results and Lessons Learned

SpeakFluentNow supported users across multiple regions. The speech recognition logic respected natural pauses, Stripe payments were secure, and the interface adapted to different languages.

Key takeaways:

  • Custom logic helps with edge cases like speech recognition stoppages.
  • A robust webhook approach prevents double billing or missed payments.
  • Building internationalised interfaces from the start ensures a better global release.

Conclusion and Next Steps

SpeakFluentNow’s code base showed how to combine serverless tools, voice technology, and global payment systems in one platform. Although I have moved on, lessons learned still guide my current work.

Project Images