Sketch-2-Code is a project which focuses on making coding easier and simpler. When it comes to coding in Swift, if we have any* doubts we refer to tutorials, blogs, etc, that was the usual way, But no more old procedures. Sketch-2-Code is the new & faster method to find help. Provide your UI Sketch or Text down your requirements and get instant output snippets with ready-to-use implementations of UIElements by S2C(Sketch 2 Code).
Our core mission is to increase the efficiency of the typical App development workflow & removing the redundant & time-consuming bits from the process by providing an easily accessible & automated solution where user can just provide a Sketch of UI and code will be autogenerated. This is how Sketch 2 Code came into existence.
When we thought of something like this we were clueless on how to start and build this product. But later with the flow we tried various techniques, various languages and got one which would suit our requirements. Eventually with time we made the normal procedure more easy and user friendly to developers by integrating Machine Learning models into S2C.
We also realised that it wasn't convenient for all to draw a Sketch of UI and hence also added another feature called Text 2 Code which is an even easier way where user can just type-in their requirements and the code wil be generated.
The Sketch2Code solution uses the following elements:
- Clone or download the app from this repository. 👩💻
- Open project file in terminal. 💻
- Open
Swift Co-Pilot.xcodeproj
in the app folder. 💾 - Change the bundle identifier. ⚙️
- Press Ctrl + R to run the app. 📲
- Do star this repo and/or contribute if you like it.🙂
In total we have 2 types of code generators:
Rigt now we have two type of Sketch 2 Code conversion:
- In this we have concentrated on single UIElement detection. There are times when developers need code of a specific type of UIElement.
- So in such cases users can go on with using the Single Element Detection.
- While using this feature developer need to provide the name of the element above and its shape.
- Providing name is really important
- And for elements like Buttons, TextFields user need to provide its shape too.
Make sure you spell the element type correctly🪄
- As the project tite suggests our prior motve was to ease the work of coding UI stuffs.
- If you want to get code of a particular UI screen then you can use this feature.
Make sure you draw a rectangle box and add your UIElements inside it.
Make sure you spell the element type correctly🪄.
You need to follow the naming type as given above.
- Text 2 Code is an additional feature which we have added for people who are not good in sketching😅.
- Using Text 2 Code is really easy and simple, just start writing the element type and the suggestion box in the app will show you the order of writing.
- While writing the text you need to follow a set of order, which will be provided automatically by the App.
Sketch to Code
provides code snippet for UIElements in Swift & SwiftUI.Text to Code
generates code snippet based on text provided.Save Snippet
saves code snippets to our backend.
- We used domain.com to create and launch server with the codebase we have right now.
- Cockroach DB was used for storing and retrieving information in real-time.
|
|
With the upcoming releases we have thought of bringing various new features like:
I. Multiple Coding Language Support
II. Add more UIElements
III. Adding enhanced NLP in Text2Code, to make it more versatile
IV. Make object detection more enhanced
V. Release Sketch2Code as a Beta release to know user feedback
- Right now S2C is not powerful enough to support all the UIElements that come with Xcode but, we are working on a top-down approach of covering the most used UIElements with the best possible accuracy.
- When we say provide Sketch and Text you do need to follow a few practices with your inputs to use S2C.
- Right now S2C is limited to Swift language, in future we tend to make it available for other programming languages too.
- With upcoming versions we focus on making S2C more powerful and more versatile
- Xcode 12+
- Swift 5+
- For the server backend: Python 3.8.5 (with the requirements.txt installation)
This is a hackathon project made by MLH Fellows - Pod 3.1.0 i.e. Recursive Rhinos - Team 4
Alex | Gokul Nair | Prabaljit Walia |
GitHub Usernames | Domain |
---|---|
@gokulNair | iOS App + Documentation |
@prabaljitWalia | iOS App + Documentation |
@Alex | Backend |
- Feel free to contribute 💪🏼
Made with ❤️ By Developers