デザインシステム with ピグマ

The flower of web animation, scroll animation! Learn about ScrollTrigger, which allows you to use GSAP more powerfully.

“GSAP is capable of this?” Breaks the stereotype that animation is complex and difficult.

GSAP will take you one step closer to interactive web development and change the way you look at animation.

This class will help you plan and design an MVP using the atomic component system. You will learn how to understand and utilize design components.

This is a PDF file tutorial on how to use Figma for developers.

Midjourney, the premier tool for image-generating AI! From basic usage to real-world application through practical design projects, all in one go!

You can improve your mobile web production skills, which are the most competitive in publisher employment and publisher practice. As a publisher, you can hone almost all production methods and know-how for producing mobile web. In particular, we have explained in detail the process of working on mobile web UI design with Figma, so that you can cover a large part of the design skills required of publishers and developers these days by learning Figma. In the mobile web publishing class, we explain in detail the detailed method of writing HTML wireframes, which is the strongest part of the class. Through the lecture, your HTML wireframe production skills will be greatly improved. Mobile web publishing is a learning process that perfectly matches the layout for mobile and tablet using CSS variables (Var), so that you will have the ability to work on practical tasks that are similar to real work. You will gain sufficient intermediate to advanced CSS practical skills, focusing on Flex layout.

There are app/web ideas that they want to implement, but they are at a loss as to where to start due to their lack of experience in app service planning, startup representatives who want to learn planning systematically in a short period of time, and junior planners who want to learn the planning work process and know-how of experienced planners. We will teach you a new planning method using Figma and the work skills of a PM with 17 years of experience from the basics so that you can become an expert.

Taking your first steps in web development? Special offer for those just starting with HTML, CSS, and JavaScript! Want to create a mobile website to keep up with the mobile era, but unsure where to start? Don't worry. Learn the core of responsive web development naturally by directly analyzing and implementing Figma mobile designs. Based on sleek mobile designs, we'll explore everything together, from subtle interactions that capture users' hearts to technologies that perfectly adapt to various screen sizes. Now, let's share the know-how to make your website shine on all devices. Shall we begin together?

This course provides UX principles and practical know-how necessary for planning and designing AI products. We will explore user-value-centered AI utilization methods, UX planning and design methods using AI, core UX principles and theories learned through everyday design cases, and UX research and data analysis methods for providing a better experience.

CSS Grid is a powerful tool that allows you to implement complex layouts simply and intuitively. This lecture is designed to help you easily learn the core concepts of CSS Grid to practical applications step by step. Stop being tied to complicated floats and flexboxes and learn the standard of efficient layout design! Start now!

Now, with the power of AI, anyone can easily plan apps and design UIs! It's okay even if you don't know coding or have no UI experience. AI tools like Claude and ChatGPT will turn your ideas into reality. With just a few questions, you can analyze target customers, design app structures, and even automatically generate UI screens. In this lecture, we will teach you step-by-step from the basics so that even those who are new to Figma can follow along. Even without drawing by hand, you can import existing website UIs at once with the HTML to Design plugin, and with AI tools like Google Stitch or readdy.ai, you can create high-quality screens in a few seconds. This lecture is perfect for anyone dreaming of starting a business, wanting to switch careers to a planner, or wishing to communicate with developers. Instead of complex theories, we will only teach practical know-how that you can immediately use. Now, with just an idea, anyone can plan app services!

In the AX era where AI technology and UX design converge, what strategies should product teams use to design customer experiences? A 17-year veteran senior researcher from a major corporation and knowledge sharer with a PhD in HCI will share insights based on the latest trends, use cases, and research findings.

Seo Ja-young, Kiki, and Kang Young-hwa talk about self-growth methods and soft skills based on cases they experienced in their careers.

Do you have a foundation in HTML, CSS, and JavaScript (jQuery)? But are you unsure how to create an entire website? If so, try implementing a shopping mall's main page by referencing a design. We'll share know-how on implementing a website by referencing a completed design and understanding the planning intentions and detailed aspects of the design.

This lecture provides a step-by-step explanation of the process of implementing a Figma design into a web page. It covers the entire web publishing practice, from saving images to writing HTML, CSS, and Javascript. It is systematically designed to be easy for beginners to follow. Through practice-oriented learning, you can learn how to efficiently convert web designs into code.