7 ms·
I made a free Figma library packed with components for fast prototyping
- deleted 2y ago[deleted]
- jillesvangurp 2y agoVeryfront is amazing. I've known Koji for several years and he and his team have built a lot of great tech that now covers everything from rapid design iteration, to developing with their web IDE, with a live preview (it actually continually builds your website). and deploying using their cloud hosting solution. The technology stack is very flexible. You can add your own components, libraries, styling solutions, backends, etc. And there is also an export option if you want to leave their platform that gives you everything in code form. The big benefit of veryfront is that you can get started and have a webapp live in no time at all. You don't need anyone working on devops because they do it for you. You don't need to setup a lot of tools because it all runs in the browser. You don't need to figure out how to set up these tools either because they do it for you. You just code your webapp.
- kojiwakayama 2y agoThanks so much Jilles. I really appreciate it!
- deleted 2y ago[deleted]
- baxter001 2y ago[flagged]
- hbarka 2y agoFrontPage 98 would like a word.
- kojiwakayama 2y agoBringing back good old memories :)
- deleted 2y ago[deleted]
- submeta 2y agoI am about to draft a UI and user flow for an internal tool (an LLM based RAG). I was thinking about using Vercel/V0. Is this an option? What else can I use? Is Figma a must have in my tool belt?
- kojiwakayama 2y agoStart prototyping the user journey in Figma to map out the flow. For frontend, use Next.js or Vite/Vike, which we use at Veryfront for its lightweight and performance. Simple API calls (e.g., OpenAI) can use a server function, but for RAG, I’d recommend a Python backend service.
- mattkevan 2y agoThis is a RAG search I built with NextJS, Pinecone and Langchain. It also uses AI for content tagging and summarisation. https://www.uxlift.org/search/ https://www.uxlift.org/search/ I made a quick wireframe in Figma, but didn’t bother to pixel-perfect it. I mostly design in the browser, but taking a few minutes in figma up-front to get the shape of it saves time in the long run. If I’m designing for stakeholders or dev teams I’ll still absolutely produce full prototypes and designs otherwise bad things happen. Figma is the current market leader, but you could use anything that you can communicate your intent well enough with, from the back of an envelope to a competitor like Penpot or Sketch. Just don’t use Photoshop. V0 is interesting, but the results can be inconsistent. For my site I just copied and pasted the shadcn components I wanted and tweaked the styling to fit. Not sure V0 would be faster, though it might be useful for generating ideas. Depends on how much control you want over the final layout.
- submeta 2y agoWow, excellent site. Very useful!
- kojiwakayama 2y agoGreat work on the website! Figma is definitely the way to go. Having everything spec’d out beforehand makes implementation and iteration so much easier and faster.
- baxtr 2y agoI would love to have a text box in Figma and then just type in what I want. "Design a basic login screen. Change red for yellow. Move the layer up front." Is anyone working on this at Figma?
- dennisy 2y agoYes they are releasing AI features: https://www.figma.com/ai/ https://www.figma.com/ai/
- submeta 2y agoIsn‘t vercel v0 doing this?
- kojiwakayama 2y agoGreat idea to allow prompt based design!
- amelius 2y agoNo need to do it in Figma. Soon your OS will be able to do it, and it will be able to use all apps on your system to create a design, not just one app.
- kojiwakayama 2y agoInteresting. Are you thinking of an agentic system here?
- someothherguyy 2y agohttps://techcrunch.com/2024/07/02/figma-disables-its-ai-design-feature-that-appeared-to-be-ripping-off-apples-weather-app/ https://techcrunch.com/2024/07/02/figma-disables-its-ai-desi...
- jjcm 2y agoWe’ve since re-enabled it after addressing the underlying issue. Source: I’m the pm who launched the feature.
- ThinkBeat 2y agoIt seems to be a hosting company, that offers goddies different level of goodies based on the price of the subsciption?
- kojiwakayama 2y agohi, yes we offer different tools to streamline the web development process, such as: - Veryfront Studio, an online coding platform with live previews, instant deployment, and code exports. - Veryfront Components: Ready-made UI components for fast app building. - Veryfront Templates: Starter templates to kick off your projects. - Veryfront Figma Kit: A Figma library packed with components for quick prototyping You can try everything for free for an unlimited time and upgrade to a paid plan when your app is ready to go live.
- kojiwakayama 2y agoHi HN, I’m Koji, software engineer and co-founder of Veryfront, where we offer tools to streamline web app development. Happy to share insights or answer questions about design, development, or anything related to building apps. AMA!
- djshah 2y agoHi Koji, this looks like a fantastic tool! I think it will pair nicely with Locofy (https://locofy.ai https://locofy.ai) for handoff from design to AI-generated code to really simplify the frontend process! I’ll be sharing this with my design team!
- nelsonic 2y agoGreat work as always @kojiwakayama looks superb!
- kojiwakayama 2y agoHey Nelson, thank you very much! :)
- eichi 2y agoWhy not create crappy frontend to validate demand for MVP then hire a designer? Designer is cheap.
- kojiwakayama 2y agoYou can directly start coding in Veryfront Studio using the same components from the Figma Library as ready-made React components. Having tools for both designers and developers which integrate is key imo.
- tomrod 2y agoI'm going to be very naive here as this isn't my space at all. Are these open sourced? If not these, are there react components I can grab for basic front end projects that won't run afoul of licensing?
- kojiwakayama 2y agoYes, all components and templates are open source. Both Figma and React components.
- DidYaWipe 2y agoFigma isn't. However, there is an open-source competitor called Penpot: https://penpot.app/blog/7-reasons-penpot-is-more-than-just-a-figma-alternative/ https://penpot.app/blog/7-reasons-penpot-is-more-than-just-a...
- DidYaWipe 2y ago[flagged]
- geoffpado 2y agoWasn't me, but… you didn't actually answer the question. @tomrod asked if *these components* were open-sourced, and your response was that *Figma* is not. It didn't answer the question that was posed. The information provided isn't actually all that useful. Can Penpot even use the components in question?
- sadboi31 2y agoYeah absolutely. There is a plugin for importing. Some small things like fonts and such might break sometimes but it has otherwise worked for 80%+ of everything i've downloaded off ui8
- tomrod 2y agoWhile it wasn't specifically what I asked, I did appreciate the additional information. As an old man, I often ramble and find myself listening to rambling in return. Sometimes useful, and sometimes just the sweet symphony of shared space.
- replwoacause 2y agoLooks nice but I just wish every new thing wasn’t React based
- kojiwakayama 2y agoThanks for the valid feedback. What is/would be your preferred stack?
- trevorhinesley 2y agoFWIW I +1 that comment. Great tool, just not my stack. Rails + Hotwire here
- kojiwakayama 2y agoRails and Hotwire is a nice stack. Thx!
- deleted 2y ago[deleted]
- n144q 2y agoFor prototyping purpose, how does this compare to other design kits, e.g. Material Design? https://www.figma.com/community/file/1035203688168086460/material-3-design-kit https://www.figma.com/community/file/1035203688168086460/mat...
- kojiwakayama 2y agoMaterial Design is awesome. What I like about Veryfront components is that it includes also section components which are larger building blocks and integrates nicely with Veryfront Studio for seamless dev handoff, which then allows to go from build to deployment quick and easily.
- computergert 2y agoAny plans to support Vue as well?
- kojiwakayama 2y agoThanks, good question. Eventually yes but atm the focus is on React and enabling one seamless development process. We aim to eventually enable all types of javascript stacks.
- pmg102 2y agoNice work. Tip: you're missing an 'l' from Frequenty Asked Questions
- kojiwakayama 2y agoOups. Thanks for spotting! Fixing :)
- stevebmark 2y agoI'm really into audio production, and I would re-record the video without using a mechanical keyboard, and ideally not in an echo-y room. It's not very watchable right now. In addition to using a noisy keyboard not appropriate for video recording, you type very hard / angrily. Switching to a quieter keyboard with low key travel might help you prevent RSI in the future.
- kojiwakayama 2y agoThanks Steve for the feedback!
- DidYaWipe 2y ago[flagged]
- DidYaWipe 2y ago[flagged]
- tdb7893 2y agoI think assuming why people are down voting and telling people to go to Reddit isn't a particularly high quality comment. More to the point: in English "angrily" doesn't necessarily mean the subject is emotionally angry, you'll often see phrases like "the waves crashed angrily into the shore" and no one thinks the water is emotional.
- DidYaWipe 2y agoThat's because a person is not operating the water in that statement. In this case, we have a person who was directly accused of typing "angrily." If "Poseidon angrily pounded the shore with waves," you'd think yes, he's pissed about something.
- jeffhuys 2y agoHonestly, your comments are much more “Reddit-like” to me than the post/actions you’re referring to.