Learn how to develop advanced interaction effects frequently featured on Apple's website from scratch.
Advanced interaction techniques frequently used on Apple websites
High resolution video interaction
Controlling keyframes and elements using scrolling
How to use Canvas for high-resolution image processing
Awesome web interactions like Apple product introduction pages ,
Want to try developing it with your own hands? 🍎
Apple's product introduction pages vary slightly in design and effects, but their core interaction principles are similar. This course explores and creates the core interaction principles applicable across Apple product pages , using precise scrolling to control various design elements . Utilizing the applied effects, we'll create complete, organically connected pages .
Macbook Pro introduction page (click) 
Airpods Pro introduction page (click)
These days, when Apple releases a new product, it's fun to just browse, but there's also the anticipation of how amazing the product introduction page will be. I'm sure everyone on the web is enjoying it, right?
Since we don't just use what others have created, but analyze the core principles and implement them one by one , I think it will be of great help when implementing forms or ideas that are completely different from Apple's.
After working hard and persevering, you will feel more confident in developing challenging visual implementations.
Looking at it, I thought, 'How can I make something like this?'
'I want to try this in my project too.'
This class is for people who think like this.
Learning Content
Lecture Features
👌 We build it from the ground up using only standard web technologies, keeping the principles in mind.
👌 It is structured in detail so that you can practice for more than 10 hours without missing a beat, even with tight cut editing that doesn't stretch.
👌 Because we only use standard techniques, you can learn solid fundamentals that won't change over time.
Added code and tutorial videos for creating new interaction effects on the iPad Air introduction page released in September 2020.
Create dynamic, interactive websites that will elicit exclamations of "Oh!"
Creating an interactive website with 1 Minute Coding
This is a roadmap of lectures. This lecture is included .
Who is this course right for?
Anyone who is curious about how to implement the fancy and cool interactions on the Apple website
Anyone interested in implementing creative, interactive web
Anyone who wants to create a special portfolio website
People who have a romantic idea about the developer and developer
People who liked the 1-minute coding lectures
Need to know before starting?
Basic knowledge of CSS and JavaScript
19,408
Learners
1,240
Reviews
1,175
Answers
5.0
Rating
11
Courses
서울에서 웹 개발자/디자이너로 일했고, 제주를 거쳐.. 현재는 말레이시아 페낭에서 열심히 개발도 하고, 교육 콘텐츠도 만들고, 1인 기업으로서 해볼 수 있는 여러가지 시도와 실험들을 해보고 있습니다.
비주얼 임팩트가 있는 인터랙티브 웹에 관심이 많고, 유튜브와 페이스북 "1분코딩"에서 웹 개발 관련 기술들을 공유하고 있어요.
개발자/디자이너/콘텐츠크리에이터
페이스북 https://www.facebook.com/1mincoding
All
60 lectures ∙ (11hr 55min)
Course Materials:
All
225 reviews
5.0
225 reviews
Reviews 8
∙
Average Rating 5.0
5
I've said this many times, but this Apple web show Kang-i is one of the most concise and cool Korean interactive shows. Even though it's an animation or canvas that I've never used, it's not easy to follow the Kang-i's example of how to do difficult things like drawing quickly. Although I'm a late bloomer, I don't know DOM well, so I had a hard time figuring out the CS:GO. However, since Kang-i's tutorial is done with a good scenario for 1 minute coding, I don't know if it's a good show or not. Even fans who watch it can easily upgrade their skills through Kang-i. That's all I can say.
ㅋㅋㅋㅋㅋㅋㅋ As your nickname suggests, Minam uses the word "Pangka" really well... I guess I should put it this way. It's a magic that even a translator can't translate it, but I'll understand what you're saying ㅋㅋㅋㅋㅋ Thank you, Mr. Heo, no, Mr. Ahn ㅋㅋㅋㅋㅋ
Reviews 1
∙
Average Rating 5.0
5
Oh. What is it.. This is interesting...
It's funny.. You said something I really like! Haha Thank you for your good review on the first class review, Heopnim^^
Reviews 1
∙
Average Rating 3.0
3
#Best in web design and interaction! #From a programmer's perspective, well..? If you are a web designer who wants to do publisher work or a publisher who is close to design, it may not be a problem, but if you are someone like me who dreams of becoming a great programmer who is more familiar with the front-end or back-end than the design field, you often have questions when looking at the code. I personally thought this. 'Can't the code structure be more concise?' 'Hey, wouldn't it be cleaner if I processed it as a function...?' 'Huh? If I processed this as a formula, the value would come out automatically, so why do I have to input numbers like 0.22 one by one?' ## Don't code while modifying it like I did. It is good for your mental health to copy it as it is. I wrote the code by modifying it little by little instead of copying 1 Minute Coding's code as it is, and I feel like I'm going to die while debugging. ㅠㅠ I wonder if it would have been better if you had used a well-structured code while considering students who are not familiar with programming. The current code is too poorly readable and is messy like spaghetti code, so if you modify it and miss it for a moment, it's quite difficult to analyze... But don't misunderstand. This is the only drawback. Everything else is great. There's nothing to criticize. The concepts are explained in detail and delicately. It's also good that you explain them in detail with pictures. It's easy to understand, and the lectures are thoughtfully edited, so it's less boring. I'm leaving a review so that it will be helpful to students like me among the many students. Please think of it as completely copying the code and avoid doing useless things like I did.
Reviews 1
∙
Average Rating 5.0
5
The way functions work, how to get values and use them, and the parts that beginners like me might not know when writing script methods or variables in between were explained in detail. To be honest, there were many parts that I didn't understand, but if I continued to write these codes repeatedly, I gained the confidence that I would be able to make them mine someday!! I'm not a major, but based on this lecture, I'm going to create my own portfolio and prepare for employment! Thank you.
Wow, you wrote in detail about the parts that were helpful to me, so it was very helpful to me as well^^ You studied really hard, so thank you so much for writing such a great course review, Chan-gi. I hope you create a great portfolio and get hired at the place you want!
Reviews 3
∙
Average Rating 4.7
5
Not only coding, but also additional explanations using pictures and materials! This is a very useful lecture that teaches the concepts and designs of programming, not just simple code!
Since this is a somewhat difficult lecture, I tried my best to make it as easy to understand as possible. Thank you for noticing this and leaving a good review^^
$59.40
Check out other courses by the instructor!
Explore other courses in the same field!
.png?f=avif&w=420)
![[Inflearn X Living Coding] HTML and the Internet강의 썸네일](https://cdn.inflearn.com/public/courses/335806/cover/88d920fe-0c13-484f-8d31-1f1be0c6c4e0/335806.png?f=avif&w=420)
![Web Design Development Technician [2025] Complete Practical Course (KakaoTalk Q&A Available)강의 썸네일](https://cdn.inflearn.com/public/courses/332868/cover/3a2245ca-bb9f-414a-ba67-403cfcb2b7c9/332868.jpg?f=avif&w=420)
