How does it work?

Each day you'll receive a challenge.

1 . Each day you'll receive a challenge.
Join the <a href="https://discord.gg/adobexd?sdid=7RZ367N1&mv=affiliate" target="_blank">community chat</a> to stay informed and connect with others.

2 . Join the community chat to stay informed and connect with others.
Watch the daily live show to get started and ask questions.

3 . Watch the daily live show to get started and ask questions.
Finally, share your work to get feedback from mentors and other participants!

4 . Finally, share your work to get feedback from mentors and other participants!

Unlock The Challenges

  • December 2, 2
    Build Your Own Search Engine
    Build Your Own Search Engine
    Design a search engine that displays history with balanced typography and flow.
  • December 2, 2
    Build Your Own Search Engine
    Build Your Own Search Engine
    Design a search engine that displays history with balanced typography and flow.
  • September 19, 2022
    Custom Email Templates
    Custom Email Templates
    Level up your emails with customized templates that will help you communicate more clearly and with more style.
  • September 20, 2022
    Animated Interactive Buttons
    Animated Interactive Buttons
    Add interactions to your buttons using Auto-Animate and Lottie files.
  • September 21, 2022
    Find The Perfect Color
    Find The Perfect Color
    Design a shopping widget with an interactive color picker.
  • September 22, 2022
    3D in XD Made Easy!
    3D in XD Made Easy!
    Use 3D Transforms to create a mobile wallet that jumps off the screen.
  • September 23, 2022
    Build Your Own Search Engine
    Build Your Own Search Engine
    Design a search engine that displays history with balanced typography and flow.
Notify me about future XD challenges

Next Steps

  • Design at the speed of thought.
    Wireframe, design, prototype, present, and share amazing experiences for web, mobile, voice, and more — all in one app.
  • Chat with the community
    Connect with the XD community on Discord to get valuable feedback on your work and find answers to your questions.

Explore Past Challenges

Interactive Timer Widget
Interactive Timer Widget
Create an interactive timer widget from scratch!
Maintenance Tracking App
Maintenance Tracking App
Design a custom app to practice your layout and interaction skills.
Activity Finder App
Activity Finder App
Learn how to streamline your user experience by building a custom app.
Ticketing App Design
Ticketing App Design
Make an easy-to-use app with structured hierarchy and visual flair.
Fashion Planning App
Fashion Planning App
Create an app to plan your outfits for back to school!
Classified Ad Homepage Makeover
Classified Ad Homepage Makeover
Redesign the homepage of a classifieds site to make it more user-friendly and modern.
News Homepage Makeover
News Homepage Makeover
Redesign the homepage of a news site to make use of whitespace and to make advertising less intrusive.
E-commerce Navigation Menu Makeover
E-commerce Navigation Menu Makeover
Reimagine an e-commerce website's expandable menu to increase usability.
Furniture Store Homepage Makeover
Furniture Store Homepage Makeover
Establish a visual hierarchy to highlight featured products and calls to action.
Movie Ticket Homepage Makeover
Movie Ticket Homepage Makeover
Optimize your user flow to take them from landing to checkout in a flash!
#CreateWaves Social Media Posts
#CreateWaves Social Media Posts
Create social media templates to join #CreateWaves, a campaign using creativity to help raise awareness about the critical impacts of climate change on our ocean and planet.
Mobile Onboarding Experience
Mobile Onboarding Experience
Make a great first impression by creating a seamless onboarding experience for a mobile device.
How to Create A Case Study
How to Create A Case Study
Show off your best projects by creating an organized and engaging case study!
Adobe Xd 101 Part 1
Adobe Xd 101 Part 1
This is Adobe Xd for beginners! Learn the basics of Adobe Xd by using components, states, and 3D transform!
Adobe Xd 101 Part 2
Adobe Xd 101 Part 2
Let’s learn more about Adobe Xd! Practice your skills and grow your knowledge of repeat grids, auto-animate, and prototyping previews.
Marketing Banners
Marketing Banners
Design several marketing banners for your brand, using components to help update your various elements.
Event Invite Cards
Event Invite Cards
Design digital cards for an upcoming invite. Include a preview of confirmed guests and call to action buttons.
Landing Page
Landing Page
Design a landing page for a travel experience. Use a full-width image or video to help showcase destinations.
Smart Home Launcher
Smart Home Launcher
Design and prototype a smart home device, with ‘cards’ that launch into various applications.
Onboarding Experience
Onboarding Experience
Design and prototype a mobile onboarding experience. Include videos or Lottie animations to enhance the experience.
Web3 Website Design
Web3 Website Design
Design your own decentralized exchange landing page from scratch with custom animations.
NFT Website Design
NFT Website Design
Design a homepage for your own NFT platform using gradients and 3D effects.
Fitness Landing Page
Fitness Landing Page
Prototype your own fitness website landing page using hover interactions and animations.
Modern Homepage
Modern Homepage
Reimagine a modern car website design with grids and stacks.
Futuristic Portfolio
Futuristic Portfolio
Design your very own animated futuristic portfolio by prototyping with hover interactions & animations.
Check Out Made Easy
Check Out Made Easy
Make checking out a breeze by desiging a One-Tap checkout mobile app.
Showcasing Your Products Online
Showcasing Your Products Online
Create a stunning homepage to showcase your products with a modern design!
Animating Your User Interface
Animating Your User Interface
Add motion to your user interface to create some extra interested on your app or website.
Creating A Style Guide In Minutes
Creating A Style Guide In Minutes
Build a style guide for quick reference to get your design cohesive and streamlined!
Desiging With Sidebar Navigation
Desiging With Sidebar Navigation
Create a custom dashboard using sidebar navigation layouts.
Vintage Menu
Vintage Menu
Combine typography and black and white imagery to create a vintage website, inspired by diner menus of the past.
Parallax Type
Parallax Type
Learn how to use parallax effects to create the perfect website header by giving your typography some dimension!
Vertical Typography
Vertical Typography
Showcase your product on a website by using vertical typography combined with refined imagery.
Modern Website Design
Modern Website Design
Design a sleek and modern website by using Adobe Fonts to find the perfect typographic voice for your mobile website.
Emoji Maker
Emoji Maker
Use Lottie animations and component states to create your own emoji card maker.
Swiping Gestures
Swiping Gestures
Swipe Right! Practice designing with gestures in mind as we create a crypto app with swiping interactions.
Loading Animations
Loading Animations
Give your website some visual interest and energy by creating dynamic loading animations.
Collapsible Sidebars
Collapsible Sidebars
Maximize your space with a collapsible sidebar that can be used as a project dashboard.
Responsive Widgets
Responsive Widgets
Use Responsive Design to create widgets that can be used on desktop or mobile applications.
Animated Instagram Story
Animated Instagram Story
Create a social media story for an e-commerce business using auto-animate and export as video.
Speed Up Your Process
Speed Up Your Process
Save time on your screen designs with help from an Adobe XD UI Kit.
Inclusive Copy & Imagery
Inclusive Copy & Imagery
Consider inclusive copy & imagery when creating a profile screen for a dating site.
User Onboarding
User Onboarding
Design the loading screen, onboarding experience and home page for a fitness app. As you work, focus on layout and balance.
Scrolling Effects
Scrolling Effects
Create the browsing experience for a mobile streaming platform using scrolling effects alongside Auto-Animate.
Crypto App
Crypto App
Use gradients and blurs to create the wallet and onboarding screens for an app used to manage cryptocurrency.
Video Playback
Video Playback
Incorporate video playback features into your designs as you create an engaging social media app.
Data Animation
Data Animation
Learn to transform complex data into unique elements using Auto-Animate and Timed Transitions.
Movie App
Movie App
Create a user flow for a movie app by using animations to transition between the home screen and movie details.
Meditation App
Meditation App
Design and prototype the homepage and ‘now playing’ page for a meditation app using stacks.
Vertical Carousel
Vertical Carousel
Learn to design and animate card elements using stacks and auto-animate for a workout scheduling app.
Homepage Banner
Homepage Banner
Design and prototype a rotating homepage banner with embedded video.
Vacuum Hub
Vacuum Hub
Design the hub and scheduler for a robot vacuum application. Use Auto Animate, Audio playback and Lottie animations to bring your design to life.
Mobile Ordering App
Mobile Ordering App
Design a juice ordering app where users can mix-and-match ingredients to create custom recipes. Use Drag gestures and Timed Triggers to mimic a realistic ordering experience.
Smart Watch Interface
Smart Watch Interface
Design a simple Apple Watch interface, using UI kits to build realistic interactions. Then, turn your design into a showstopping Behance post using 3D and animation.
Streaming Dashboard
Streaming Dashboard
Design a mobile video streaming dashboard with looping video and scrollable sections.
Wine Tasting App
Wine Tasting App
Design a rating experience for wine tasting tours. Allow users to swipe between various wines and apply ratings using Drag gestures and Auto Animate.
Art Gallery
Art Gallery
Design a browsable horizontal art gallery. Give dimension to the scrolling experience with typography, video and hover effects.
E-Commerce Bike Builder
E-Commerce Bike Builder
Design and prototype an E-Commerce Bike builder. Use gestures and Auto Animate to simulate part selection and color customization.
Home Screen
Home Screen
Design the home screen for a music video app that utilizes video playback.
Sign-Up Screen
Sign-Up Screen
Using components, create a slick sign-up screen that references neumorphism.
Animated Onboarding
Animated Onboarding
Using Lottie animations, create an engaging onboarding experience.
Landing Page
Landing Page
Using repeat grid and video playback, design a high-converting landing page.
Micro-Interactions
Micro-Interactions
Using auto-animate, design micro-interactions for the home screen of a to-do list app.
Dark Mode
Dark Mode
Design a social media feed in dark mode using vertical scroll groups.
Wearable Technology
Wearable Technology
Design a few critical screens for a futuristic health app on a smartwatch using voice commands.
Mobile First
Mobile First
Use responsive resize with stacks to seamlessly go from mobile to desktop for an e-commerce homepage.
Course Dashboard
Course Dashboard
Learn how to design an online education dashboard. If you have extra time, turn things up a notch by adding simple animations.
Loading Animation
Loading Animation
Level-up your designs with loading animations that loop.
Dynamic Transitions
Dynamic Transitions
Learn how to animate a unique page transition using Auto-Animate.
Showcase Your Designs
Showcase Your Designs
Showcase a responsive landing page for mobile and web using Timed Transitions.
Unique Menus
Unique Menus
Create an animated mobile-app drawer menu using Auto-Animate.
Music Player
Music Player
Create a music player screen using the Audio Playback feature.
Ride-Share App
Ride-Share App
Design a screen for a ride share app. Use the plugin Stark to check for contrast accessibility.
Timeline Screen
Timeline Screen
Design and prototype an animated timeline using Auto-Animate.
Presentation
Presentation
Using the presentations plugin, create and prototype a presentation with dynamic animations.
Roommate Finder
Roommate Finder
Design a roommate matching experience. Use Drag Gestures and Auto-Animate to create swiping interactions.
Travel AR Experience
Travel AR Experience
Design a smartphone AR experience that assists travelers using 3D transform.
Real Estate Marketplace
Real Estate Marketplace
Design a for-sale real estate listing. Use Stacks to organize and rearrange items within your artboard.
Reserve Campsite
Reserve Campsite
Design a campsite reservation experience using voice commands.
NFT Website
NFT Website
Design a modern login screen for a NFT website. As you prototype, try creating an animated login button.
VPN Application
VPN Application
Design and prototype a mobile VPN experience where users can select their country and activate the VPN.
Ecommerce Check-Out
Ecommerce Check-Out
Design an Ecommerce check-out experience for desktop. As you prototype, create a slider displaying an image for each product.
Bluetooth Barbecue
Bluetooth Barbecue
Design a Bluetooth connected barbecue application where users can view the cooking status of their food.
Membership Pricing
Membership Pricing
Create the membership page for a website that features pricing tables with toggles for monthly versus annual costs.
Freelance Tracker
Freelance Tracker
Design an application where freelancers can track revenue, expenses and clients at-a-glance.
Budgeting Experience
Budgeting Experience
Design the subscription tracking experience for a budgeting app. As you prototype, allow users to filter by subscription type and view card usage.
Weather Application
Weather Application
Design a colorful and minimalist weather application using mesh gradients and Swiss typography.
Animated Buttons
Animated Buttons
Design and animate an interactive sign-up button.
Navigation Bar
Navigation Bar
Design a navigation bar and then give it unique interactions using Prototype mode.
Photo Carousel
Photo Carousel
Design and prototype a photo carousel with hover triggers.
Mouse Drag
Mouse Drag
Design a simple web page, then prototype mouse drag interactions using drag animations.
Page Load
Page Load
Design and prototype a unique loading animation using Auto-Animate.
Creative Animations
Creative Animations
Design mobile card components and then prototype animated ‘slime’ interactions.
Event Booking Website
Event Booking Website
Design the landing page for an event booking website and then add animated interactions using Prototype mode.
Events Page
Events Page
Design and prototype the events page for an events website. Try using hover animations to create unique interactions.
Mood Board
Mood Board
Create the foundational pieces for a plant-care app. Make a mood board that depicts your vision and begin organizing colors and character styles within Document Assets.
Onboarding Screen
Onboarding Screen
Design the onboarding screen for a plant-care app using Component States. Try creating a carousel that highlights app benefits.
Loading Screen
Loading Screen
Design the loading screen for a plant-care app. Include a logo and try prototyping a Timed Transition from this screen to the next.
Questionnaire Screen
Questionnaire Screen
Design the plant questionnaire for a plant-care app using Repeat Grid to create a vertical list that can be customized with text and images.
Browsing Page
Browsing Page
Design the plant browsing page for a plant-care app. Try creating scrollable sections using Scroll Groups.
Info Page
Info Page
Design the plant info page for a plant-care app. Let users quickly navigate to specific sections using Anchor Links and Scroll-to.
Dashboard Design
Dashboard Design
Design the dashboard screen for a plant-care app. Include an overlay screen for task details using an Overlay Transition.
Search Screen
Search Screen
Design the find-a-plant screen for a plant-care app. Include a search bar and try prototyping results using Auto-Animate.
Filtered Search
Filtered Search
Design a hobby finder where users can use filters to quickly explore new interests. Use Repeat Grid to quickly build prototype-ready screens.
Scrollable Lists
Scrollable Lists
Design a web prototype where users can track and view goals. Use Scroll Groups and Anchor links to prototype an easily navigable experience.
Parallax Website
Parallax Website
Design the landing page for a headphones website. Try using Auto-Animate to give your prototype a parallax effect.
Animated Charts
Animated Charts
Design a routine tracker that displays habits using animated charts. As you design, use States to create a mini design system.
Swipe and Select
Swipe and Select
Design a vinyl record interface where users can swipe, select, and learn more about albums. Try using Swipe animations and 3D Transform to bring this experience to life.
Restaurant Booking
Restaurant Booking
Design an experience for booking a table at your favorite restaurant. Allow users to select a table and pre-order appetizers using guided prompts.
Streaming Service
Streaming Service
Design a web-based streaming service where users can explore TV and movies. Try prototyping interactions using Horizontal Scroll alongside Auto-Animate.
Voice Triggers
Voice Triggers
Design and prototype a smartwatch app for learning languages. Allow users to test their skills using Voice Triggers.
Package Delivery
Package Delivery
Design the notifications for a smartwatch package delivery app. Use sounds to notify when an item is en route or has been delivered.
Email Actions
Email Actions
Design the action options for a mobile email app. Use Drag Triggers to prototype options like delete, archive, or reply.
Word Counter
Word Counter
Design the word counter for a writing app. Use Auto-Animate to increase the word count as users write.
Video App
Video App
Design the dropdown menu for a video conferencing desktop app. Use Component States to prototype microphone or video source options.
Brewing Schedule
Brewing Schedule
Design the brewing scheduler for an automated coffee maker app. Use Sliders to add brewing options such as flavor, grind size and start time.
Discover Page
Discover Page
Design the discover page for a social media app. Use Stacks to arrange content in different groups based on trending items or popular hashtags.
Search Engine
Search Engine
Design the ‘open tabs’ page for a search engine. Use 3D Transforms to simulate a 3D experience where each page is opened.
Appointment Scheduler
Appointment Scheduler
Design a tool for finding and scheduling COVID vaccination appointments. Give your users multiple options using Component States.
On-Page-Scroll
On-Page-Scroll
Design and prototype ‘on-page-scroll’ animations for a promotional landing page using timed triggers.
Loading Screen
Loading Screen
Design and prototype the loading screen animation for a healthy juice brand using Auto-Animate.
Custom Icons
Custom Icons
Reimagine the hero section of the Among Us website using 3D assets from Adobe Dimension.
Parallax Effect
Parallax Effect
Design and animate the home page for a movie platform using parallax scrolling effects.
Vertical Scrolling
Vertical Scrolling
Design and prototype a web-based photo gallery utilizing vertical scrolling.
Stacks
Stacks
Design a news website with easy-to-build sections using Stacks.
Micro-interactions
Micro-interactions
Design a personalized shoe E-commerce platform incorporating micro-interactions on product cards.
Masks
Masks
Design a portfolio homepage with dynamic hover animations using Masks and Hover Interactions.
Pricing Table
Pricing Table
Design the pricing table for a website! Try using Repeat Grids to speed up the process.
Sign-up Form
Sign-up Form
Design a sign-up form that focuses on ease-of-use. Be sure to use components for quick editing.
Financial Charts
Financial Charts
Design and prototype an interactive web-based financial chart. Use Auto-Animate to bring it to life.
Landing Page
Landing Page
Design a landing page for a website of your choice. Save your colors and character styles as assets for quicker editing.
Nested Dropdown
Nested Dropdown
Create a dropdown menu for a web-based platform using nested components and hover.
Credit Card Payment
Credit Card Payment
Design and prototype a web-based payment screen using 3D Transforms and Auto-Animate.
Marketing Banners
Marketing Banners
Design several eye-catching banners for your marketing pages. Try using Padding to streamline your editing.
Online Dashboard
Online Dashboard
Build out an online dashboard and use Auto-Animate to transition between various circular charts.
Profile Page
Profile Page
Design your profile page for a social media platform. Use the Libraries panel to add and save assets to your project.
Scrollable Cards
Scrollable Cards
Create content cards that extend off of their artboard, then use Scroll Groups to add interactivity.
Friends Feed
Friends Feed
Design the friends feed for a social media platform. Use Repeat Grids to quickly add text and images.
Emoji Picker
Emoji Picker
Design and prototype an emoji picker with various options. Use nested components to add interactions.
3D Flip
3D Flip
Design and prototype a Stories experience, using 3D Transforms to navigate between images.
Messages
Messages
Create a messages experience for a social media platform. Utilize Stacks to quickly rearrange and space out groups and layers.
Navigation Bar
Navigation Bar
Design and prototype a navigation bar across multiple screens using Component States. Try adding animated icons!
Video Call
Video Call
Design a video calling experience between multiple users. Add fun sound effects using Audio Playback.
Hairstyle Generator
Hairstyle Generator
Create an experience for trying on new hairstyles and colors. Use the swipe feature to browse through different options.
DIY Browsing Experience
DIY Browsing Experience
Design an experience for browsing through home improvement projects and ideas. Use Stacks to organize the tools and materials listed under a specific project.
Hobby Randomizer
Hobby Randomizer
Create an experience that helps users find new hobbies. Allow users to select keywords, then generate a list of suggestions alongside required materials.
Exercise Scoreboard
Exercise Scoreboard
Create an exercise tracking experience that can be played with friends. Design a leaderboard, using Components for avatars and icons.
Plant Planner
Plant Planner
Design and prototype an experience for planning which plants to plant during different seasons. Add dropdown menus to select month and plant type.
Reading Tracker
Reading Tracker
Design an E-reader experience that tracks users’ reading progress throughout the year. Use the 3D Transforms tool to create a page-flip animation.
Budgeting App
Budgeting App
Design a budgeting app that tracks and manages expenses. Create a graph that moves when the budget is adjusted using Auto-Animate.
Yearly Planner
Yearly Planner
Design a digital planner for the desktop. Allow users to add events using Hover triggers to create a hover effect.
Landing Page
Landing Page
Design a web-based landing page on a topic of your choosing. Try adding depth using Background Blur.
Interactive Map
Interactive Map
Design and prototype an interactive map using Scroll Groups.
Dropdown Menu
Dropdown Menu
Design and animate an expandable dropdown menu using Nested Hover.
Card Flip
Card Flip
Create a card flip animation using 3D Transforms and Auto-Animate.
Augmented Reality
Augmented Reality
Design and prototype a mobile augmented reality experience using 3D Transforms.
Presentation Template
Presentation Template
Design a presentation template and save it as a Component for easy editing.
Slide-out Menu
Slide-out Menu
Design and prototype a slide-out menu using Component States.
Browsable Library
Browsable Library
Design a browsable music library for iPad using Repeat Grids.
Movie Timeline
Movie Timeline
Design a web experience that tracks the release of famous movies. Use Stacks to rearrange the items within the timeline and Horizontal Scroll to bring the project to life.
Video Chat App
Video Chat App
Design and prototype a video chat experience where users can add stickers and emojis on screen. Use auto animate to bring these micro-interactions to life.
Sales Page
Sales Page
Design the sales page for a product website that lets users know when others around the world have purchased an item. Use Timed Animations and Component States to prototype notifications.
Team Meeting Planner
Team Meeting Planner
Design a scheduling tool for remote teams! Allow users to add topics, discussion items and other important details. Use Repeat Grid and Stacks to design reusable UI components!
Habit Tracker
Habit Tracker
Design a mobile habit tracker where users can input habits and track progress over time. Use Drag Gestures to complete tasks and Auto-Animate to give your interactions some pop.
AR Gaming Dashboard
AR Gaming Dashboard
Design the UI for an Augmented Reality gaming dashboard. Let your users scroll through and select games, integrating them into the screen using 3D Transforms.
Smartwatch Time Tracker
Smartwatch Time Tracker
Design a smartwatch experience where users can add, activate and track activities using voice commands.
Client Portal
Client Portal
Create a freelance client portal where clients can track the project, sign contracts and make online payments. Use Anchor Links for quick portal navigation!
Pet Dress-Up
Pet Dress-Up
Design a pet costume experience where users can dress up their pets in Halloween outfits. Use the Drag feature to create a slider that moves through different options.
Campground Mapper
Campground Mapper
Design the map experience for a camping app. Allow users to pan the map with Scroll Groups and use Component States to show campsite availability.
E-Commerce Webpage
E-Commerce Webpage
Design the product page for a bike helmet website where users can filter by color, size or other options. Use CC Libraries to manage your images and elements.
Pumpkin Carving Randomizer
Pumpkin Carving Randomizer
Design and prototype an experience that randomizes Jack-O-Lantern designs. Allow your users to shuffle designs and test faces before selecting an option.
Fall Festival Map
Fall Festival Map
Design the map experience for a fall festival. Display other users as well as various stops and attractions. Try using plugins to discover unique avatars.
Fall Foliage Finder
Fall Foliage Finder
Design a fall foliage finder that shows users where they can find colorful foliage throughout the year. Use a slider to visualize changes per season.
Check-in App
Check-in App
Design the ticketing and check-in experience for an apple orchard. Prototype an experience where users can fill out their payment info for goods and services.
Interactive Decorations
Interactive Decorations
Design an interactive pie or cake decorating experience. Create a scrollable area where users can select options such as cake type, number of layers, filling, or toppings.
Stacks
Stacks
Design and prototype a mobile to-do list. Use Stacks to easily organize and rearrange items within your artboard.
Auto-Animate
Auto-Animate
Design the media library for a desktop app that organizes music, movies and entertainment files. Use Auto-Animate to create micro-interactions and transitions.
Design System
Design System
Select and create the basic components of a design system: typography, colors, buttons, icons. Then, use the assets panel to turn them into reusable elements.
Sounds
Sounds
Design the video calling interface for a smart device. While prototyping, use Voice Recognition and Audio Playback to simulate the experience.
Interactions
Interactions
Revisiting the to-do list design from challenge #1, create swiping interactions for completing or deleting tasks. If you did not complete challenge #1, use the starter file.
Component States
Component States
On a topic of your choosing, design a desktop form with input fields and buttons. Use Component States to create multiple states for the fields and buttons.
Anchor Links
Anchor Links
Design the FAQ section for a website of your choosing. Try creating a pinned navigation area with Anchor Links that snap to different areas of the page for relevant answers.
Scroll Groups
Scroll Groups
Design a desktop media player for TV and movies. Allow users to pan through different sections of the media player using Scroll Groups.
Swipe
Swipe
Design the swiping interaction for a digital wallet holding several payment methods. Allow the user to swipe through and choose which card to use.
Auto-Animate
Auto-Animate
Design a virtual tour experience for a museum. Allow users to view different rooms and design an indicator displaying which room they are in.
Stacks
Stacks
Design a quick-access widget for a podcast platform. Use Stacks to organize important info in the widget like switching podcasts, play/pause, and info about the podcast.
Personalization
Personalization
Design a journaling app interface where users choose from a set of provided prompts. Allow users to select their mood, productivity level and more using Component States.
Scroll Groups
Scroll Groups
Design an interface for browsing saved e-books. Sort the books by category on different shelves, and use Scroll Groups to allow scrolling through the categories.
Slider
Slider
Design the selection interface for a smoothie machine. Use sliders for the interactions like choosing drink size, type of fruit and sweetness level.
Sounds
Sounds
Redesign an eye health widget that reminds users to rest their eyes. Using the starter file, add reminders to stand, stretch, and exercise accompanied by sound notifications.
Drag & Drop
Drag & Drop
Design an online portal for a history class where students can find the syllabus, homework and more. Use the drag-and-drop feature to quickly create student profile pictures.
Transitions & Animations
Transitions & Animations
Design product and category pages for an E-commerce experience. Then, prototype a transition from the category page to the product page.
Product Options
Product Options
Bring an E-commerce product page to life with color, size and quantity options. Try using Component States and Auto-Animate as you work.
Scroll
Scroll
Design a scrollable browse page for a mobile shopping app. When items are selected, introduce sound interactions for confirmation.
Navigation Aids
Navigation Aids
Design a web page that allows for quick and easy navigation using Anchor Links and a ‘back to top’ button.
Shopping Cart
Shopping Cart
Design a cart experience for an E-commerce website. Allow users to remove items from the cart and confirm checkout.
Animated Icons
Animated Icons
Design simple vector icons to dress up an E-commerce UI and then animate them on hover and click.
Filter
Filter
Design the filter experience for a travel website. Focus on making it easy for users to find what they’re looking for!
Sliders
Sliders
Design and prototype a set of expandable options for an E-commerce experience. Try incorporating adjustable sliders for options like price, duration and distance.
Stacks
Stacks
Design the timeline experience for a project tracker using Stacks to quickly add and organize tasks. As you work, try creating a tracker for this week’s challenges!
Auto-Animate
Auto-Animate
Design and prototype a social media experience where users can interact with posts using ‘hearts.’ Use Auto-Animate to improve your interactions.
Asset Panel
Asset Panel
Design a Kanban board for a project management tool. As you design, select a custom color palette and apply it to your screens.
Sounds
Sounds
Design the navigation dashboard for a spaceship! While prototyping, add sounds to prompt users with interstellar directions.
Interactions
Interactions
Design a baby name generator and prototype an experience where users swipe left or right indicating preference.
Component States
Component States
Design and prototype an interactive form. Try creating a carousel that highlights a user’s progress and use Component States for pagination.
Anchor Links
Anchor Links
Design a web-based education experience where users can bookmark and preview lessons. Try adding navigation aids using Anchor Links.
Scroll Groups
Scroll Groups
Design an interactive and scrollable roadmap for a project tracker using Scroll Groups. When you’re finished, use the Share tab to distribute your designs for feedback.
Landing Page
Landing Page
Design the landing page for a personal finance website. As you work, try saving colors and character styles to the Assets Panel!
Live Support
Live Support
Design the live support experience for a personal finance website. Try using Component States and Tap Triggers to activate an expanded button state.
Features Overview
Features Overview
Design the features overview section for a personal finance website. Use Stacks to quickly rearrange the various sections you create.
Sign In and Sign Up
Sign In and Sign Up
Design the sign in and sign up experience for a personal finance website. Allow your users to quickly navigate the page using Anchor Links.
Home Screen
Home Screen
Design the home screen for a personal finance mobile app. Use Content-Aware Layout to add padding to your sections.
Scrollable Charts
Scrollable Charts
Design an interactive chart for a finance mobile app. Allow users to scroll around the chart using Scroll Groups.
Payment
Payment
Design the payment experience for a personal finance mobile app. Use Auto-Animate to create engaging interactions during the payment process.
Wallet
Wallet
Design a digital wallet experience for a personal finance mobile app. Use Repeat Grid to quickly design a list of transactions.
Scrollable List
Scrollable List
Redesign the contacts experience for a work-related messaging app. As you design, use Scroll Groups to create a scrollable contacts list.
Sound Effects
Sound Effects
Design the ‘reactions’ panel for a video conferencing app. As you prototype, incorporate audio feedback allowing participants to react with emojis and sounds!
Progress Indicator
Progress Indicator
Design and prototype the progress indicator for a live streaming interface. Display when the user is previewing, going live and has completed the broadcast.
Slider Control
Slider Control
Design the control hub for studio or desk lighting. As you design, use Drag Triggers to create a slider that controls lumens and temperature.
Homepage Design
Homepage Design
Redesign the homepage for a well-known project management tool. As you design, use Stacks to organize important information like project status, contributors and dates.
Map Interface
Map Interface
Design a map interface that displays remote working locations. As you work, create a scrollable map using Scroll Groups that displays nearby cafes and coworking spaces.
Scheduling Tool
Scheduling Tool
Design the interface for a scheduling tool that coordinates remote meeting times. Use Component States to create check boxes that indicate time preference.
Time Tracker
Time Tracker
Design a time tracking app where users can quickly add and organize projects within timed sessions. When your design is complete, explore the Share tab within Adobe XD.
Crafty Masks
Crafty Masks
Design the explore experience for an arts & crafts mobile app! Use Masks and Repeat Grids to speed up your design process.
Burger Builder
Burger Builder
Design the burger builder experience for a food ordering app. User Component States and Auto-Animate to animate toppings as users customize their orders.
Galactic Scroll Groups
Galactic Scroll Groups
Design a space exploration mobile app for kids and parents. Allow users to pan around galaxies and hover over planets using Scroll groups!
Digital Exploration
Digital Exploration
Design a web experience where gamers can explore custom Minecraft worlds. Let your users quickly navigate the main page using Anchor Links.
Campsite Finder
Campsite Finder
Design the interface for a campsite finder. Use Scroll Groups and Stacks to let users pan an area and rearrange campsites.
Audible Sightseeing
Audible Sightseeing
Design and prototype the sightseeing experience for a road trip app. Let your users explore maps with Scroll Groups that incorporate Audio Feedback when they interact with landmarks.
School is Cool
School is Cool
Design the course experience for a summer school app. Focus on creating a fun and engaging experience, allowing users to level up as they progress!
Animated Shorts
Animated Shorts
Design the sorting and filtering experience for an E-Commerce app. Use Auto-Animate to move products in and out of a masonry layout and create a quick view mode using Overlays.
Scrolling Galleries
Scrolling Galleries
Design a mobile experience that contains scrollable galleries of cards. Expand upon your design with links to additional artboards.
Maps Experience
Maps Experience
Design a maps experience that displays several locations of interest. Use Scroll Groups to allow users to pan around.
Notes Application
Notes Application
Design a notes application including various panes that contain scrollable content. Use Stacks to easily rearrange your layers.
Kanban / Schedule
Kanban / Schedule
Design a kanban board or schedule to help you and your team work together. Use Scroll Groups and Stacks to improve your workflow.
Case Study
Case Study
Prepare a case study for Behance, utilizing Stacks to help you rearrange the various sections.
Location Indicator
Location Indicator
Design the virtual tour experience for a real estate website. Allow users to view different rooms and design an indicator displaying which room they are in.
Progress Meter
Progress Meter
Design the progress meter for an E-commerce checkout flow. Allow your users to click on the meter to visit previous steps, providing sound effects as they click.
Navigation Aids
Navigation Aids
Design an E-commerce website for workout apparel. As you design the webpage, add navigation aids such as Anchor Links.
Bill-Splitting App
Bill-Splitting App
Create the interface for a bill-splitting app. Prototype the splitting experience with drag triggers and Auto-Animate, allowing users to choose shares with sliders.