[DMP 2024]: Digital Credentials Schema template design studio in CREDEBL Web UI

[amitpadmani-awts]

Ticket Contents

Description

The Digital Credentials Schema Template Design Studio is an innovative module that needs to be developed within the CREDEBL platform. It aims to simplify the creation of schema templates for digital credentials by providing an intuitive user interface (UI) equipped with various components such as text, images, and QR codes. The studio offers seamless drag-and-drop functionality, allowing users to design templates tailored to specific schemas effortlessly.

Key Features:

• Drag-and-Drop Interface: The design studio offers a user-friendly interface where users can easily drag and drop components onto the canvas to create schema templates.
• Real-Time Preview: The studio provides a real-time preview of the schema template as users design it, enabling them to visualize the final output and make adjustments accordingly.
• Customization Options: Users have the flexibility to customize the properties of each UI component, such as font styles, colors, sizes, and alignment, to ensure the template meets their desired specifications.
• Schema Integration: The design studio seamlessly integrates with the CREDEBL platform, allowing users to directly associate their schema templates with specific digital credentials.
• Template Management: Users can save and manage multiple schema templates within the studio, facilitating easy access and organization of their designs.

Goals & Mid-Point Milestone

Goals

• Week 1: Setup CREDEBL platform & studio UI &
• Week 2: Research on existing template creation tools & Collaborate with mentors about workflow.
• Week 4: Setup template design studio page with element selection like schema attributes, element selection and list of saved templates.
• Week 6: Add element selection with UI components for text, images, QR codes, and other required elements. Develop drag-and-drop functionality for adding and arranging components. Also give edit and delete options.
• Week 8: Text input customization like colour, font family, font size etc.
• Week 9: Ensure responsiveness and compatibility across different devices and screen sizes.
• Week 10: Save & Display the list of created schema templates.
• Week 11: Edit & Delete schema templates.

Setup/Installation

About CREDEBL - link
The module needs to develop CREDEBL studio - link
CREDEBL platform setup - link

Expected Outcome

No response

Acceptance Criteria

No response

Implementation Details

Experience required in React js, TypeScript, Node js, Postgresql, Astro js

Mockups/Wireframes

No response

Product Name

CREDEBL Studio

Organisation Name

Blockster Labs (CREDEBL)

Domain

Open Source Library

Tech Skills Needed

Astro.js, Deno, Docker, ESLint, HTML, NestJS, React, TypeScript, UI/UX/Design

Mentor(s)

@shitrerohit
@amitpadmani-awts
@ankita-p17

Category

Backend, Database, Frontend