Flutter UI Tutorial - Designing Clean Travel News App UI Design (Figma to Flutter) | PART 3

Опубликовано: 27 Июль 2026
на канале: Abdul Aziz Ahwan

10,582

213

Sign up for 10,000 free mins: https://bit.ly/3PKT9Jr
Find out more about ZEGOCLOUD: https://bit.ly/3WB81My
How to create video call app: https://bit.ly/3FQ7uzJ

Hi everyone, I am ‪@abdulazizahwan‬ from Indonesia,
In this video, we are going to learn Flutter UI which we are going to convert Traveling News App UI Design to Flutter.

#news #travel #app #flutter #design #ui

PART 1 (   • Flutter UI Tutorial - Designing Clean Trav...  )
PART 2 (   • Flutter UI Tutorial - Designing Clean Trav...  )
PART 3 (   • Flutter UI Tutorial - Designing Clean Trav...  )

🔖 JOIN FLUTTER COURSE 🔖
Build real, responsive applications! (Portfolio, E-commerce, Crypto App, Budget Tracker)
This course is designed for beginner to intermediate developers who want to build their future with Flutter
https://gumroad.com/a/659170419/fqamxr

----------------------------------

👨‍💼 Business Inquiries: [email protected]

----------------------------------

⚠️ FLUTTER & DART VERSION
Flutter 3.3.0
Dart 2.18.0

🔨 PACKAGE FOR THIS PROJECT
google_fonts (https://pub.dev/packages/google_fonts)
flutter_svg (https://pub.dev/packages/flutter_svg)
carousel_slider (https://pub.dev/packages/carousel_slider)

🌃 VSCODE THEME
https://marketplace.visualstudio.com/...

📂 PROJECT FILE
UI Design File (https://www.figma.com/community/file/...)
Assets File (https://abdulazizahwan.gumroad.com/l/...)
Flutter Project Code (https://abdulazizahwan.gumroad.com/l/...)

----------------------------------

⏲ Timestamp
00:00:00 👨🏻‍💻 Chapters
00:00:27 Say Thank You
00:00:38 Our Goals
00:01:10 Design Breakdown
00:01:50 Open Previous Project
00:05:18 Our Previous Project
00:05:36 Import New Assets
00:06:18 Setup Profile Screen
00:11:34 Setup Header Section
00:19:56 Setup User Description Section
00:21:20 Setup User Stats Section
00:27:07 Setup User Post List Section
00:41:01 Setup User Popular Post Section
00:44:31 Conclusion
00:45:42 Closing!

----------------------------------

This video was made with great effort,
If you want to support me you can donate to the following link

Join this channel to get access to perks:
   / @abdulazizahwan

💰 PAYPAL
Link ► https://paypal.me/abdulazizahwan

🧧 SAWERIA
Link ► https://saweria.co/abdulazizahwan

🪙 TRAKTEER
Link ► https://trakteer.id/abdulazizahwan

☕ BUY ME A COFFEE
Link ► https://buymeacoffee.com/abdulazizahwan

----------------------------------

🤙 JOIN MY DISCORD
Link ►   / discord

----------------------------------

Hopefully, you would love this video.
I am so grateful if you want to hit the subscribe button. Thanks

📌 SUBSCRIBE ME
Here ► http://bit.ly/AbdulAzizAhwan

----------------------------------

🎬 ANOTHER PLAYLIST
Flutter UI Design Best Practices
Link ►    • Flutter UI Tutorial - UI Design Best Pract...

Flutter Firebase CRUD Tutorial
Link ►    • Flutter Firebase CRUD Tutorial

Flutter Tutorial - Basic [EN]
Link ►   • Flutter Tutorial - Basic [EN]

----------------------------------

👨‍💻 GEAR LIST & TOOLS
MacBook Pro 2017 
( 8GB RAM 256GB Ventura OS )

Acer Swift 3 SF314-54G-51ZK
( 12GB RAM 256GB SSD NvME M.2 Windows 11)

Keychron K2 V2 Blue Switch

Logitech MX Master 2s

Canon EOS M50 Sigma 16mm f1.4

Logitech C922 Pro Webcam

Thronmax Mdrill Zero M4

----------------------------------

📱 FOLLOW
Twitter ►   / abdulazizahwan
Github ► https://github.com/abdulazizahwan
My Blog ► https://abdulazizahwan.com

----------------------------------

Thanks for Watching!
#Dart
#Android
#iOS
#Swift
#Kotlin