Manage Sketch Design from Admin Panel

As a programmer, I always try to optimize and automate things.
One day, saw my wife ( designer ) how she was copying sketch files. And how in the single file there were a lot of similar sections done with copy-paste.

Her job was to design infographics for mobile apps.

And here where the requirements

  • Header ( Info about the app + 5 screenshots )
  • Features ( 6 features per app – icon + short text )
  • Sections information ( Section Title + Description + 3 images )

And this should be don for 10 apps. Shop App, Night club app, Radio app, you get the idea. And for each app, she needed to provide different .sketch files

Soon as she did the first design, she copied the .sketch file for the second app.
This was so wrong in my idea. So I needed to find a way to fix this.

Found this plugin

Data Populator

It is a plugin that with provided JSON can modify the values of the design. Text Labels and Images. Great.

In 5 min I optimized the sketch design to be suitable for the DataPopulator.

I know the Firebase Realtime Database will be the perfect solution because I can get the data in .json format.

And with the help of my tool I can build a Content Management System ( CMS ) that will be the perfect manager of the Firebase Data needed for the Sketch Design.

I made the admin panel in no time. And created the initial Shop app.

The process video documented here.

The end design looks like this.

If you are interested in – A Headless CMS for Firebase Realtime Database and Firestore, you can create an admin panel for your data for any need.

More Articles for You

What is Firebase

Firebase is real-time database using cloud technology. That permits you to make application without server side coding and Rest APIs. …

— Featured —

Firebase RTDB VS Firebase cloud DB

Firebase is a backend of your apps which includes many features like Realtime Database, cloud storage, user authentication, static hosting and …

— Featured —

Firebase Vs Dynamo DB

Firebase: Firebase is an entire ecosystem used to build web and mobile apps. It is a more complete solution when …

— Featured —

Firebase vs MongoDB: Which Database Is the Best for Your App

What do you think is the most challenging part when starting with the development of your application? From our experience, …

— Featured —

What is NoSQL Database

NoSQL Database is a non-relational database that can store and retrieve data. To simplify, imagine NoSQL database as a tree. …

— Featured —