- 214
- 441 583
Locofy
Приєднався 24 тра 2021
Welcome to Locofy's UA-cam channel! 🚀
Turn your Figma designs into code in 1 click with Locofy Lightning, powered by Large Design Models!
Leveraging advanced AI, we make design-to-code seamless and efficient for both developers and designers.
Our channel offers tutorials, tips, and insights to maximize your use of Locofy Lightning. Whether you're a pro developer or a creative designer, our content empowers you in UI/UX development.
Enjoy walkthroughs, feature highlights, community stories, and updates. Stay ahead in digital design with us!
Subscribe for the latest in #LocofyAI, and revolutionize your design-to-code process.
Try Locofy Lightning now: locofy.ai
Turn your Figma designs into code in 1 click with Locofy Lightning, powered by Large Design Models!
Leveraging advanced AI, we make design-to-code seamless and efficient for both developers and designers.
Our channel offers tutorials, tips, and insights to maximize your use of Locofy Lightning. Whether you're a pro developer or a creative designer, our content empowers you in UI/UX development.
Enjoy walkthroughs, feature highlights, community stories, and updates. Stay ahead in digital design with us!
Subscribe for the latest in #LocofyAI, and revolutionize your design-to-code process.
Try Locofy Lightning now: locofy.ai
Dev Update: Automatically Identify 22 Additional Tags!
We added 22 additional tags to our AI models. Check it out!
Join our Discord: discord.com/invite/r6UDBhEQ4s
View our Documentation: locofy.ai/docs/lightning
Join our Discord: discord.com/invite/r6UDBhEQ4s
View our Documentation: locofy.ai/docs/lightning
Переглядів: 281
Відео
Import Custom Components from GitHub
Переглядів 251Місяць тому
In this video we show you how to import your custom component library from your GitHub repo Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: www.locofy.ai/docs/custom-components/import-from-github/
Import Custom Components from Storybook
Переглядів 111Місяць тому
In this video we show you how to import your custom component library from a public Storybook. Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: www.locofy.ai/docs/custom-components/import-from-storybook/
Import Custom Components from a Codebase
Переглядів 365Місяць тому
Major new update. We now allow you to import your component libraries. We can now use your components, rather than generating new code! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: www.locofy.ai/docs/custom-components/overview/
Tips and Tricks - Responsive Footers
Переглядів 173Місяць тому
In this video, we show how you can quickly make your footers responsive! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Tips and Tricks - Responsive Designs with Fill Container and Max Width
Переглядів 160Місяць тому
In this video, we show how to use Fill Container with Max Width to make your designs responsive using Locofy Lighting! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Tips and Tricks - Responsive Images
Переглядів 94Місяць тому
In this video, we show how to make your images responsive! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Design Best Practices for React Native
Переглядів 4052 місяці тому
In this video, we go over some design tips and tricks for React Native and Locofy! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Tagging your React Native Bottom Tabs
Переглядів 1222 місяці тому
In this video, we show how you tag your React Native Bottom Tabs! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Dev Update - Tour of Locofy Builder
Переглядів 3212 місяці тому
In this video, we will take you on a tour through the key features of the Locofy Builder! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Dev Update - Design to Code, Incremental Updates
Переглядів 2952 місяці тому
In this video, we show how you easy it is to now do Incremental Updates, when converting your Design to Code. Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Tips and Tricks - Edit Multiple Component Instances at Once!
Переглядів 1242 місяці тому
In this video, we show how you can create easily edit multiple Components at once using Locofy Lighting! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Dev Update - Creating, Updating, and Deleting Components
Переглядів 1262 місяці тому
You can now Create, Update, and Delete Components directly inside the Locofy plugin! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
Dev Update - React Vite
Переглядів 1122 місяці тому
Locofy now supports React Vite! Join our Discord: discord.com/invite/r6UDBhEQ4s View our Documentation: locofy.ai/docs/lightning
BuildShip & Locofy Livestream: Create Apps Fast with Low-Code and AI
Переглядів 9303 місяці тому
BuildShip & Locofy Livestream: Create Apps Fast with Low-Code and AI
Tips and Tricks - Learn to create Accordions with Locofy Lightning
Переглядів 3303 місяці тому
Tips and Tricks - Learn to create Accordions with Locofy Lightning
Tips and Tricks - Adding New Media Queries
Переглядів 1423 місяці тому
Tips and Tricks - Adding New Media Queries
Tips and Tricks - New Feature: Component Creation in the Locofy Plugin!
Переглядів 3323 місяці тому
Tips and Tricks - New Feature: Component Creation in the Locofy Plugin!
Live stream Breakdown: Design best practices - Removing Overlapping Layers
Переглядів 2233 місяці тому
Live stream Breakdown: Design best practices - Removing Overlapping Layers
Live stream Breakdown: Design best practices - Good Layer Names
Переглядів 963 місяці тому
Live stream Breakdown: Design best practices - Good Layer Names
Live stream Breakdown: Design best practices - Using Borders instead of Line Seperators
Переглядів 843 місяці тому
Live stream Breakdown: Design best practices - Using Borders instead of Line Seperators
Live stream Breakdown: Design best practices - Using Min/Max Height/Width to Improve Responsiveness
Переглядів 1153 місяці тому
Live stream Breakdown: Design best practices - Using Min/Max Height/Width to Improve Responsiveness
Live stream Breakdown: Design best practices - Adding Wrapper Frames
Переглядів 853 місяці тому
Live stream Breakdown: Design best practices - Adding Wrapper Frames
Live stream Breakdown: Design best practices - Use Paragraph Spacing Instead of New Line
Переглядів 1193 місяці тому
Live stream Breakdown: Design best practices - Use Paragraph Spacing Instead of New Line
Live stream Breakdown: Design best practices - Using the same Layer Structure for Components
Переглядів 823 місяці тому
Live stream Breakdown: Design best practices - Using the same Layer Structure for Components
Center Aligning Elements to improve Responsiveness | Design best practices | Live stream Breakdown
Переглядів 803 місяці тому
Center Aligning Elements to improve Responsiveness | Design best practices | Live stream Breakdown
Live stream Breakdown: Design Tips and Tricks - Flattening Complex Backgrounds
Переглядів 1173 місяці тому
Live stream Breakdown: Design Tips and Tricks - Flattening Complex Backgrounds
Design to Working Youtube Clone with no code!
Переглядів 3933 місяці тому
Design to Working UA-cam Clone with no code!
Locofy Livestream: Design best practices
Переглядів 5224 місяці тому
Locofy Livestream: Design best practices
Where do we get that hamburger icon, what i got from a plugin does not get recognised by locofy while developing
I bet You are Vietnamese:))
Hello. How did you manage to adjust the style of input (floating label) when making the input field interactive?
Thank you! Can you also add animation's on the buttons? so yeah how?
Fantastic, Can I do this with Web, create Routing - Navigating between Pages?
Fantastic tutorial! It will be great to have the figma file for the tutorial as well..
Hello Can I run the react native code on my phone
does is support conversion to react native yet?
I have watched this tutorial a few times and it seems that the most important elements about responsiveness are not truly clear.. It will be nice if you do another tutorial on navigation and spend a little bit more time on the design process.. on how to prep the design for different screens, specifically the header element..
I found this tutorial.. it covers pretty much everything you need to know about. navigation and responsive design: ua-cam.com/video/mcROyX3hQ6g/v-deo.html
please make a backend video for creating an app like multi vendor eCommerce application , make admin portal , vendor portal and customer application
very cool!
Can you make the github repo public please?
This is absolutely bonkers. Will be trying asap. :)
Uff esto se pone potente, este buenísimo esa nueva característica
Will this be like the react expo?
We support both Expo and React Native CLI. You can select your preference from the project settings on the builder before export.
Create Component is not showing.
Request you to join our Discord Server and message LocoSid regarding this, he will be able to assist you. You can join our discord from here: discord.gg/r6UDBhEQ4s
Could you please share the link to the design used in Figma?
You may access the design here: www.figma.com/community/file/1170288495364885012/create-a-blog-app-with-locofy-ai-prismic-io
Is it really validate the form? according to the email and password? I don't see any validation logic on the code
Hi, the input fields get a validation from the type selected. Please note that the extended business logic for validation will need to be added manually post exporting the code
it doesn't help at all!!!!!!!!!!!!!!!!!!!
Request you to join our discord server and ping LocoSid so he can assist you with the problems you are facing. You can join our discord from here: discord.com/invite/r6UDBhEQ4s
How to you create dropdown menu with selected option, i try using the dropdown feature but it is not working
You can add a few option in the dropdown menu and preselect a value from those option. If you are still facing an issue, request you to join our discord server and ping LocoSid. You can join our discord from here: discord.com/invite/r6UDBhEQ4s
Very cool! Please give me a student permit.
@MatheusSilva-qm3ph Locofy is in Free Beta and you can use it by signing up
Very good video, congratulations! Questions: Can you make a video on how to use locofy with framaer? And how does locofy work with PWA applications? Thanks.
Thank you for your suggestion
please keep improving ur software
We will. You may view our new design to code solution: ua-cam.com/video/WyWkf_5472o/v-deo.html
How can i switch from one tab to another in dashboard is this possible?
In this video we do not support the other tabs. But it is possible to generate code for it using Locofy.
Amazing 😮
Thank you
✋ *Promo SM*
Thank you
Everything is agreed, but could you please create a duplicate layer version with responsive design completed in the Lightning version? is it coming with a responsive version (duplicated layer version), or do need to create it again with responsiveness in the Lightning version?
At the moment we do not have plans to create a duplicate version of the layer but we have noted your request for it.
Thanks, but please bring it ASAP; my tasks are delayed because of this. 😅 I am Recreating the responsive version from the completed version. That’s why
I got one question? Hey james you just add hover effect for one listing items and it is working for all? You made the component on builder right? But it is already working on the preview screen? Does changes made in the builder also sync in preview?
In Locofy Lighting you can create components in the preview. Also with regard to the hover effect, when you are editing a layer that is a components we not allow you to edit a property for all instances and thus the hover works for all of them. Currently not all changes made in the builder sync to the plugin.
So you mean when we regenerate the code it just regenerate the changes we made right?
Thats correct. We no longer regenerate the full code but instead update only the design changes. Do give it a try and share your feedback with us. Thank you
Very good. One question, is it possible to use locofy with projects created with relume? Thanks
At the moment we do not support relume but we have noted your request for it
do you have z promo code to join them?
We are currently in free beta and you can sign up and use the plugin at your convenience. Figma plugin link: www.figma.com/community/plugin/1056467900248561542/locofy-lightning-figma-to-code-in-1-click-free-beta
Take my money
We are currently in Free Beta so you can use the Locofy to optimise your design and generate high quality code. Should you need some assistance in optimising your design file you can follow the best design practices mentioned here: www.locofy.ai/docs/tutorials/design-best-practices/
Please help
Hi, can you please reach our to LocoSid on our discord server: You can join our discord from this link: discord.com/invite/r6UDBhEQ4s
Hi dear locofy i get a troublesome question when deploy to vercel. It fail and show"No Output Directory named "dist" found after the Build completed." How?
Hi, can you please reach our to LocoSid on our discord server: You can join our discord from this link: discord.com/invite/r6UDBhEQ4s
This looks amazing. Congratulations and all the best
Thank you
Locofy is an astounding tool and deserves it. Hopefully when pricing hits it can still be accessible to third world countries too. It`s really a tool that helps development of business everywhere. Please consider the pricing for non-USD earners with love ;)
Thank you, we have noted your suggestion for accessibility and pricing.
Please upload the file> in description
We will be publishing this file to the Figma community soon.
will it work will all figma design or just with auto layout ?
It will work with any figma design but for optimal results we recommend that you following the best design practices and make your design autolayout. You can view our documentation for the best design practices: www.locofy.ai/docs/tutorials/design-best-practices/
what happens to all my interactive components created in Figma, all ditched, right
Should you create figma components we convert them to code components. We do not support Figma Variants at the moment but will add support for it soon. With respect to the interactions, at the moment we pick up the following interactions from the Figma Prototype: navigate, scroll, open overlay and open link. We will also extend support for the other interaction next quarter.
@@locofy_ai but Figma variants are the basis of any component.
I can't get it to work with tabbed sections, any advice?
At the moment we do not support creating tabbed section directly through locofy. You can connect with LocoSid on our discord and he can assist you with this. You can join discord from this link: discord.com/invite/r6UDBhEQ4s
this bullshit of a widget disregards all the complex work made on Figma interactive components and we have to create new interactions. What point is this?
At the moment we pick up the following interactions from the Figma Prototype: navigate, scroll, open overlay and open link.
@@locofy_ai there are tons of interactions that can be made on Figma besides those. So a UI designer has to do all interactions again on React, what is point of this?
This is complete bullshit, so my interactive components built in Figma are reduced to zero and I have to create new interactions? Locofy can shove this widget up is ass, thank you.
what if I created complex components in Figma, they are all tossed aside, right?
Should you create figma components we convert them to code components. We do not support Figma Variants at the moment but will add support for it soon.
@@locofy_ai Figma variants are the basis of any component. If you dont support variants whats the point?
Hi. Please share GitHub link of the code in the description.
underated video of responsive design( after i have compared for several video i watched)
Thank you
'Alright!'
Thank you
Fantastic !! But have few question. Can we only generate code for static website or it will be possible for dynamic one? Is it possible to generate two way data binding using angular? If yes then How? Do you provide any API integration?
We do support dynamic data through state variables and data binding in the Locofy Builder. You may view our documentation here: www.locofy.ai/docs/export-and-deployment/data-binding/
why i convert my design from XD file , all temlate using absolute to css :((
Hey, request you to join our discord community for faster support: discord.gg/r6UDBhEQ4s. You can message LocoSid on Lightning channel and he will assist you.