🙊

fixtures/bensbites.beehiiv.com/ai-app-store.md

@@ -0,0 +1,21 @@
+# The AI app store is out
+
+OpenAI has launched the [GPT Store](https://openai.com/blog/introducing-the-gpt-store?utm_source=bensbites\&utm_medium=referral\&utm_campaign=the-ai-app-store-is-out) and [ChatGPT Team](https://openai.com/blog/introducing-chatgpt-team?utm_source=bensbites\&utm_medium=referral\&utm_campaign=the-ai-app-store-is-out) plan to expand access to large language models for creators and businesses.
+
+## What's going on here?
+
+OpenAI has launched the GPT store and a new Teams plan for ChatGPT subscriptions.
+
+![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/e2cc4de3-8390-4f08-a658-1da6505b6ab4/image.png?t=1704970503)
+
+## What does this mean?
+
+Reminder: 2 months back OpenAI launched custom chatbots inside ChatGPT, calling them GPTs. These GPTs can be shared publicly or have restricted access.
+
+With the new GPT store, you can find all public GPTs in a single place. OpenAI will highlight trending GPTs and top GPTs for several categories every week. The big deal about the GPT Store is the promised revenue share program but we gotta wait for more info on that (not too much, OpenAI says rollout in Q1 2024).
+
+ChatGPT Team is the new plan on ChatGPT for shared workspaces where you can share chats, private GPTs and a dashboard to manage it all. It is pricier: $25/user/month if billed annually ($30 if monthly). You get more messages with GPT-4, longer context lengths and training on your data is default OFF. (a note: you can disable it on simple ChatGPT Plus too, it’s just on by default there)
+
+## Why should I care?
+
+Repeating Sam’s statement from Dev Day: GPTs are the first step to agents or assistants that will do everything for you. And in that case, chat does feel like the universal interface for interacting with agents. I find optimism in believing that this is an app store moment (and not the end of work 😅) and even if it is we have a transition stage to cross. Also, more improvements in GPTs about learning continuously, and getting more personalized are [also underway.](https://twitter.com/gdb/status/1745124363362578527?utm_source=bensbites\&utm_medium=referral\&utm_campaign=the-ai-app-store-is-out) So, get building.

fixtures/bensbites.beehiiv.com/ais-impact-jobs-look-frontend-engineering.md

@@ -0,0 +1,140 @@
+# AI’s impact on jobs: A look at front-end engineering
+
+### And how these lessons apply to other roles
+
+![Author](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/user/profile_picture/fc858b4d-39e3-4be1-abf4-2b55504e21a2/thumb_uJ4UYake_400x400.jpg)
+
+[Ben Tossell](https://bensbites.beehiiv.com/authors/fc858b4d-39e3-4be1-abf4-2b55504e21a2)\
+January 11, 2024
+
+👋Hey, this is Ben with a**🔒**subscriber-only issue**🔒**of Ben’s Bites Pro.A weekly newsletter covering AI trends, ideas, business breakdowns and how companies are using it internally.
+
+I’m writing a series exploring AI’s impact on specific jobs. Today I’m breaking down what AI is changing for front-end engineers and how these lessons apply to other roles.
+
+I spoke with several front-end engineers and designers to get their opinions.
+
+*Thank you, Ben Ormos, Telman - Senior Product Designer @ Microsoft, Glenn - Senior Frontend Developer at*[*Mercury*](https://mercury.com/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)*, Josh Payne - CEO of*[*Coframe*](https://coframe.ai/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)*, Arnaud & Helen - Co-Founders of*[*Galileo*](https://www.usegalileo.ai/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)*, Roy Herman - CEO of*[*supercreator.ai*](http://supercreator.ai?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)*and Alex - CEO of*[*Magic Patterns*](https://www.magicpatterns.com/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)*for your thoughts.*
+
+Here’s what stood out to me from this post:
+
+- AI’s impact on job roles is blurring the lines
+
+- How AI aids various aspects of front-end engineering
+
+- Tooling bridges the gap between different roles
+
+- The secondary benefits of using AI in your job
+
+- What the future of front-end engineering looks like
+
+- Designing interfaces to make them real
+
+- Anyone can start building products
+
+- Ever-improving websites and dynamic interfaces
+
+- Similarities across the entire organisation
+
+AI is rapidly changing many job landscapes, shifting people to facilitator roles.
+
+I’m already using AI in my day-to-day work. I think my manager would be shocked if they knew how much code in my Pull Requests were written by ChatGPT. But I still have to be there to ask the right questions, fix bugs, and shepherd code into our larger codebase, following our conventions.
+
+AI is blurring the lines between designer and front-end engineer, as its capabilities allow it to perform tasks traditionally divided between the roles.
+
+Designers typically focus on the visual aspect and user experience, creating the layout, colour schemes, and graphics.
+
+Front-end engineers typically bring designs to life with code. They develop the functional and interactive aspects of a website (or app).
+
+Now, you can potentially merge these roles with AI tools.
+
+That may be seen negatively, but with AI, its function allows the simplest work and increases demand for top 1% expertise.
+
+This is true across all job roles.
+
+### The traditional role of a front-end engineer
+
+There are many elements to this job, namely:
+
+- **Develop User Interfaces (UI):** Build and implement visually appealing, responsive, and user-friendly web interfaces using HTML, CSS, and JavaScript.
+
+- **Implement Web Design:** Translate visual and interaction designs from UI/UX designers into functional web pages, ensuring cross-browser and device compatibility, responsiveness, and accessibility.
+
+- **Optimise Performance:** Ensure web applications are optimised for speed and scalability by optimising code, graphics, and other elements for quick loading and smooth running.
+
+- ***Collaborate with Designers & Back-End Developers:*** *Work with designers to implement designs and back-end developers to integrate APIs and services, ensuring seamless data exchange and functionality within the application.*
+
+- **Debugging and Testing:** Identifying and fixing bugs in code, and implementing testing frameworks to ensure the web application's stability and reliability.
+
+- **Prototype Development:** Building functional prototypes for new features or products helps gather feedback and iterate on the design before final implementation.
+
+### Developing User Interfaces & Implementing
+
+Here are a few AI tools that have impacted front-end engineering:
+
+- [**v0.dev**](https://v0.dev/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering): a generative user interface system developed by Vercel. It uses AI to generate copy-and-paste friendly React code based on shadcn/ui and Tailwind CSS. The tool lets developers describe the interface they want to build, and v0 produces the code using open-source tools.
+
+- [**Coframe/coffee**](https://github.com/Coframe/coffee?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering): a tool developed by the Coframe team that helps build and iterate on UI 10x faster with AI, right from your IDE. (I’m an investor)
+
+- [**MakeReal by TLDRaw**](https://makereal.tldraw.com/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering): a tool that lets users sketch an interface, press a button, and get a working website. It uses the GPT-4 API from OpenAI to transform vector drawings into functional software code, using Tailwind CSS and JavaScript.
+
+- [**abi/screenshot-to-code**](https://github.com/abi/screenshot-to-code?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering): This tool takes screenshots of a reference web page and builds single-page apps with Tailwind, HTML, and JS to replicate the screenshot.
+
+- [**Galileo AI**](https://usegalileo.ai/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering): a text-to-UI tool that quickly produces high-fidelity designs from natural language prompts, trained on thousands of top user experience designs. (I’m an investor)
+
+- [**MagicPatterns**](https://www.magicpatterns.com/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering): an AI-powered platform that helps with front-end development, enabling designers and engineers to rapidly build UIs by generating them from a text prompt. Users can create patterns from any design system, including their own, and export the outcome to code or Figma.
+
+There are many more!
+
+Many of these tools generate UI elements and provide optimized code for easy implementation, significantly easing this part of the job.
+
+Blurring the lines between designer and front-end engineer.
+
+I’ve only played around with AI tools, but ultimately still end up fully making or customizing things myself (with no code). I am biased as a designer, I usually have a specific idea in mind. But for more standard components such as an FAQ, Help me, etc. I’d definitely just use AI.
+
+In the future, I can 100% see these tools becoming better than most designers.
+
+AI allows peoples to explore design solutions faster. They can generate dozens of variants of the same page in a few minutes with tools like Galileo AI. It allows them to try a lot of ideas before getting into the implementation stage. Not all front-end developers know how to design and AI can give them design superpowers.
+
+Enabling founders to do more in less time.
+
+Drastically helping me write code faster, as well as implementing more technically complex features/functionality that I might have not been able to do before, or would have taken me a lot more time (or would have needed to delegate to someone else). It started with chat-gpt, then we got GitHub’s CoPilot, and now I use Cursor which gives me the benefits of all worlds as well as learning/indexing my codebase to give me even more ROI as im building. This is first and second degree implications, but then you also have things like Vercel’s v0 or no-code platforms that wrap these new AI capabilities and allow you to potentially skip even more steps / save more time during the process.
+
+As with most creative work, AI can’t generate new UI that’s never seen before but a lot of front-end requires using standard elements; testimonials, hero sections, FAQs, and product feature lists.
+
+This is why [Tailwind CSS](https://tailwindui.com/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering) has taken off over the last few years. It’s a CSS framework for building user interfaces—it simplifies implementing good design in apps.
+
+I expect Tailwind to release an AI product soon, but others have built their own versions for now.
+
+- [Tailwind Component Generator](https://tailwind-ai-generator.vercel.app/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)
+
+- [React + Tailwind CSS AI Component Generator](https://www.microapp.io/ai-component-generator?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)
+
+- [TailwindCSS Expert](https://www.teamsmart.ai/ai-assistant/tailwindcss-expert?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering)
+
+But some external libraries can be tricky to work with.
+
+The biggest issue with external libraries is that they are not frequently updated, sometimes suit only some of your needs—you add these large libraries when you only need a portion of them, adding extra complexity to the app.
+
+you can ask agents to develop more complex interactions natively, so you can maintain these much better
+
+The default way to work with AI is through a chat interface, which may not be the right form factor for design-first work.
+
+A lot of the AI products we’ve seen to date are largely chat or text-based because of it being the easiest way to integrate with a LLM. But I think with time, the greatest products will hone in on the best way for users to interact with their AI products. Spoiler: it’s not a chat interface more often than you’d think!
+
+For example, at Magic Patterns we help customers 1) integrate with Figma, 2) connect their component library via Storybook and Github, and then 3) generate UI based off of Figma mockups using their custom components.
+
+There’s likely a balance, as if, for example, you don’t have your own component library, you may first want to generate one using the tools mentioned. Many companies, especially large ones, already have their own libraries.
+
+AI is amazing at generating boilerplate code for components and we can extrapolate that it will be able to do even more in the future. Still, mature frontend codebases have a lot of interdependencies and might be too complex for AI today. In the future, prompting within a frontend codebase could be the leading use case.
+
+It’s worth noting that [Figma AI](https://www.figma.com/blog/ai-the-next-chapter-in-design/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=ai-s-impact-on-jobs-a-look-at-front-end-engineering) is coming soon to generate UI, design components, recommend designs, add mock data, and generate code.
+
+**Similarities across different roles:**
+
+## Subscribe to Ben's Bites Pro to read the rest.
+
+Become a paying subscriber of Ben's Bites Pro to get access to this post and other subscriber-only content.
+
+[Upgrade](https://bensbites.beehiiv.com/upgrade)
+
+Already a paying subscriber? [Sign In](https://bensbites.beehiiv.com/login)

fixtures/bensbites.beehiiv.com/alexa-gets-ai-skills-characters-music-20questions.md

@@ -0,0 +1,21 @@
+# Alexa gets AI skills: characters, music and 20-questions.
+
+[Amazon announced new generative AI capabilities for Alexa](https://techcrunch.com/2024/01/09/amazons-alexa-gets-new-generative-ai-powered-experiences/?utm_source=bensbites\&utm_medium=referral\&utm_campaign=alexa-gets-ai-skills-characters-music-and-20-questions) at CES 2023. Three developers - Character.AI, Splash, and Volley - introduced Alexa skills powered by large language models.
+
+## What’s going on here?
+
+Amazon is partnering with AI startups to make their capabilities accessible by Alexa.
+
+![](https://media.beehiiv.com/cdn-cgi/image/fit=scale-down,format=auto,onerror=redirect,quality=80/uploads/asset/file/42ebfb14-3c2f-427e-99f3-675de288cd71/image.png?t=1704969476)
+
+## What does that mean?
+
+The integration for these AI tools via Alexa let you use their primary feature by chatting with Alexa. For example, Character.AI's skill lets you chat with different fictional personas like a librarian or personal trainer.
+
+Similarly, Splash's skill generates custom songs when you sing or rap lyrics. Volley’s integration creates a modern "20 Questions" game, with Alexa asking intelligent questions based on your answers.
+
+## Why should I care?
+
+Amazon’s been putting LLMs in Alexa. They recently added an LLM in the backend for Alexa to make it sound less robotic. With this new release, they are taking the approach of partnership.
+
+There are many LLM in your hand startups that are getting attention these days, but for home assistants and bigger entertainment devices, Google and Amazon are still the major players.