Objective: Create 25 projects based on a particular theme.
Technologies: HTML, CSS, JavaScript, AngularJS, MaterialUI
Duration: 25 Days (+ the weekends)
► This article includes days 26-54. (For days 1-25 please click here)
► For each day you'll find the theme, the pen, a video tutorial, and some additional information.
---------------------------------------------------------------------------------------------------------------------------
“Daily UI is a series of daily design challenges design inspiration and neat surprise rewards.” — https://www.dailyui.co
Days 26 to 31: Subscribe form
- ⇒ Themes: Day 26 - Subscribe | Day27- dropdown | Day28 - Contact Us | Day 29 - Maps | Day30 - Pricing | Day31- Upload file
- ⇒ Design Hint: Day 26 - Design a subscribe form, button, widget, etc. What type of information are you looking to capture from the user? Their name and email? Their zip code? Something else? Day 27 - Design a dropdown element. Is it a menu dropdown? Or a tip that’s dropped down during a tutorial? Day 28 — Design a Contact Us page or form. Is it for customer support? A purchase inquiry? To schedule an appointment? Think about a scenario and the most important feature it would require. Day 29 — Design a map. Not one of those old school paper ones though. Ok, that might actually be kinda neat too. ;) What type of features should it have? Should its color scheme compliment the brand the map is designed for? Day 30 — Design something related to pricing. Is it a pricing table? A restaurant menu with pricing? Day 31 - Design a file upload element. Is it the loading screen and icon? A progress element? Are folders being uploaded by flying across the screen like Ghostbusters?
- ⇒ Technologies: AngularJs, AngularJS Material
- ⇒ Helpfull Project | Image used
- ⇒ Codepen | Github
Day 32: Crowdfunding Campaign
- ⇒ Theme: Crowdfunding Campaign
- ⇒ Design Hint: Design a crowdfunding campaign. Keep in mind the purpose… raising funds. It’s important to make it compelling if you’re seeking money.
- ⇒ Technologies: AngularJs, AngularJS Material
- ⇒ Inspiration | Image used
- ⇒ Codepen | Github
Day36: EMI Calculator
- ⇒ Theme: EMI Calculator
- ⇒ Technologies: AngularJs, AngularJS Material
- ⇒ Inspiration | AngularJS Slider Demo
- ⇒ Codepen | Github
Days 37 to 38: Local Weather and Date
- ⇒ Themes:Day 37 —Weather| Day38 - Calendar
- ⇒ Design Hint: Day 37 — Design something related to weather. It could be a UI for a mobile app a web app, or something completely different such as a weather alert widget. Consider its elements: city, temperature, forecasts, colors, weather icons/graphics, etc.. Day 38 — Design a Calendar focused element. Is it for scheduling an appointment? A reservation, flight, hotel, or concert calendar? Is it a calendar reminder feature? For email or something else entirely?
- ⇒ Technologies: AngularJs, AngularJS Material
- ⇒ Helpfull Project
- ⇒ Codepen | Github
Days 39 to 40: Cookies
- ⇒ Themes: Day 39 —Testimonials | Day40 — Recipe
- ⇒ Technologies: AngularJs, AngularJS Material
- ⇒ Helpfull Project | Inspiration
- ⇒ Codepen | Github
Days 41 to 54: Workout Tracker
- ⇒ Themes: Day 41— Workout Tracker | Day42 — ToDo List | Day43 -Food/Drink Menu | Day44 — Favorites | Day45 — Info Card | Day46 - Invoice| Day47 — Activity Feed | Day48 - Coming Soon | Day49 -Notifications| Day50 — Job Listing| Day51- Press Page| Day52- Daily UI logo| Day53 — Header Navigation| Day54 — Confirm Reservation
- ⇒ Design Hint: Day 41 — Create a UI related to monitoring health or tracking various workout/training routines. It could be for a personal workout, for a team, or even gym equipment tracking someone’s workouts. Day 51 — Create a Press Page. Think about who you are representing and what important information you should convey. Is it for a new startup? A huge global brand? A nonprofit organization? Or a small local business? Or is it actually for a person such as a celebrity, athlete, politician, etc.?
- ⇒ Technologies: AngularJs, AngularJS Material
- ⇒ Design the logo | Basic AngularJS template | Helpfull Project
- ⇒ Codepen | Github
Thank you.