Ace the UI/UX Take-home Test: Full Case Walkthrough

Подписаться 12 тыс.

Просмотров 49 тыс.

50% 1

Email: jpdesignacademy@gmail.com
In this video, I share a recent take-home test I completed while interviewing for a senior product designer role at a world-renowned digital product design agency. I share my end-to-end process, including my research approach, low and high fidelity design and motion prototyping. Admittedly, this probably took me closer to 20 hours (the prompt said max 10 hours). This was the second of 4 interview stages, and I ultimately landed the job. It is my hope that this video helps you during your UI/UX interview processes, but more importantly helps you understand how to solve design challenges in a structured way.
Timestamps for your convenience:
00:00 Intro
1:40 Assignment Overview
7:37 Process Overview
8:45 Research Goals
10:50 Asking the Right Questions
11:15 Snythesis
14:47 Competitive Analysis
17:37 Low Fidelity Design
21:37 Visual ID & High Fidelity Design
25:11 Motion Prototyping
29:45 Final Thoughts
About Feelix:
Feelix is your personal AI companion who looks out for your mental health. This concept product leverages AI, machine learning, generative UI, and voice to improve your workplace wellbeing.
#AI #MachineLearning #UI #UX #Design #Aftereffects #figma #motiongraphics #Research #prototype #productdesign #animation #prototype
My new agency: yml.co/
Learn about the double diamond framework: uxdesign.cc/how-to-solve-prob...

Опубликовано:

30 июл 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 171

@JakePomperDesign Год назад

Need help prepping for an interview? You can book a 1-on-1 session with me here: tidycal.com/jakepomper

@krashvash 6 дней назад

Just incredible how this project is 3 years old and still looks so good. And with today's technology is really feasible.

@praveenpsg77 3 года назад

if you're someone smart all u need is this tutorial to get a job in the industry. Cause better than some paid course out there

@JakePomperDesign 3 года назад

❤️❤️❤️

@uchechukwuajalam 3 года назад

Absolutely. This was so well detailed!

@JakePomperDesign 3 года назад

@@uchechukwuajalam glad you thought so 🙏

@wildcats8889 2 года назад

This is so well thought out and impressive! Thanks for sharing! Love more tutorials on motion design!

@jhonnafg 2 года назад

Your channel is a gem! Thank you for sharing. This really helps because I'm still trying to put up my case study

@zuojianing1800 3 года назад

Yesssssss! Love this video! It is really useful for me since I am having one task coming next week!

@YourMajesty143 2 года назад

Feelix's character design reminds me a bit of the Headspace character "The Dot/The Face" which is this circular orange orb with facial expressions, but I like that Feelix has integrated blob features that make him soft & amorphous. Great job and thanks for sharing your work flow!

@adelinek9514 Год назад

Wow what an impressive ideas. I like the way you did the process and successfully nailed it! Hope I could be this brilliant too, when having a take home test.

@tirsoangulo 2 года назад

New to UX/UI, this is so helpfull, and you did an amazing job! Thanks!

@reipwnz Год назад

I just started getting into UX so this was really helpful and insightful. You very clearly laid out your thought process throughout the whole assignment. Thanks so much for making this!

@ywen2040 Год назад

This is fantastic, thanks for making this video!

@davidluft 3 года назад

This was awesome. I would love to see more full-process videos like it, even if they’re long.

@JakePomperDesign 3 года назад

Glad you enjoyed it! I’d love to share more of my end to end process, but it gets a bit tricky since most of my client work is protected under NDA.

@Elrykkstorm Год назад

Awesome content. please keep these coming!

@palomadiaz4341 2 года назад

Thank you so much for this walkthrough ! Motion prototyping looks so cool. Definitely on my list of skills I look forward to developing.

@JakePomperDesign 2 года назад

You’re welcome! That’s awesome 👏🏻

@weitingh84 2 года назад

Thanks for sharing this really detailed ux challenge. It's great to see you breakdown the process. Your way of thinking is really valuable!

@JakePomperDesign 2 года назад

You’re welcome! Thanks for watching 🙌

@MegaTintin84 3 года назад

Thank you for sharing your design process. It was an insightful and learning experience.

@JakePomperDesign 3 года назад

You’re welcome, I’m glad it was helpful 😀 thanks for watching 🙏

@iiiverson 3 года назад

That is fantastic!!! Very persuasive and compelling storytelling. Thank you

@JakePomperDesign 3 года назад

Thank you man 🙏 glad you think so!

@jewellscott4582 2 года назад

The best case study/Take-home test walk though I've seen! Plus you drop so many gems. Love the animation!!! You're my spirit animal bro

@JakePomperDesign 2 года назад

I appreciate the kind words man! Glad it was helpful 🤘

@anth0ni33 3 года назад

Wow. Just Wow. More of this, please. I love the full tutorial

@JakePomperDesign 3 года назад

Thank you! More coming soon 🙏👊

@winteryang3642 2 года назад

This is very useful for a green hand! I'm looking for internships now, learn a lot from this video. Thank you very much!🙇‍♀️

@elenamurasso 3 года назад

Awesome! That's such a great content, many many thanks for it! And yes, would be soo cool to get the After Effect tutorial on this. Thanks dude!

@JakePomperDesign 3 года назад

You’re welcome, thanks for watching 🙏👍. Just posted an AE tutorial for something else, but seems like a lot of you want to see how I animated this specific flow 🤔

@AnticioDukeDesigner 2 года назад

This is definitely valuable content and a great touch on design thinking. Love the approach and the full on process. I struggle with doing deep dives like this due to client NDAs and more proprietary info. Thanks to you, I may need to start doing more in a creative yet deliberate way. Love what you are doing all around. New Subscriber! Cheers...

@JakePomperDesign 2 года назад

Thanks a lot man! And I hear ya, NDA’s definitely can be tricky but there are ways around it. Cheers, Jake

@Kuungmiika 3 года назад

Wow this is amazing content!🙏🏼Really appreciate it!

@JakePomperDesign 3 года назад

Thanks for watching 🙏

@marieboucomont3582 2 года назад

That was so informative, thanks a lot! And congrats on the YML job, such a cool company

@JakePomperDesign 2 года назад

You’re very welcome, appreciate you watching! And thanks, yes it’s such a cool pace 💯🙏🤘

@emilyhu2968 2 года назад

Just wanna say thank you so much for going through a detail walk through of your take home challenge! This video really helped me on my own take home challenge, and I would like to say this video helped me land my current job :D Thank you once again! Really enjoy your content and looking forward to future videos.

@JakePomperDesign 2 года назад

That’s amazing, I’m so glad to hear it. Congrats on landing the job!

@yuyangluo4995 3 года назад

Wow man what can I say! I've watched a bunch of your tutorial videos but I have to comment on this one, it's so good! 💯 Like others have mentioned, it's so valuable to see you sharing your whole process and I definitely learned a lot! 🙏 Such incredible work that you were able to produce within a week and under 20 hours!! 👍 I've always wanted to try AE but it just seems so daunting to start, so definitely looking forward to your video on that!

@JakePomperDesign 3 года назад

Hey there, I really appreciate the kind words. I'm so glad you found this content to be valuable - that's my goal with these! Totally feel you on After effects being intimidating at first. Definitely a bit of a learning curve but opens up many creative avenues. Excited to dive in with ya'll. Thanks again for watching! Jake

@mafruhfaruqi Год назад

That's been very helpful, bro!

@brianm3160 Год назад

This is incredible!

@cryptokingss 2 года назад

I recently just started out with UI UX design, and trust me this breakdown is the best shortest yet most understandable video have seen so far. Thank you, you just got a sub

@JakePomperDesign 2 года назад

I’m glad to hear it, I appreciate the sub 👍

@JakePomperDesign 3 года назад

Timestamps for your convenience: 00:00 Intro 1:40 Assignment Overview 7:37 Process Overview 8:45 Research Goals 10:50 Asking the Right Questions 11:15 Synthesis 14:47 Competitive Analysis 17:15 Feature Assessment 17:37 Low Fidelity Design 21:37 Viz ID and HiFi Design 25:11 Motion Prototyping 29:45 Final Thoughts

@rickmoranis420 3 года назад

man this is some incredible content. appreciate you putting this out there!

@JakePomperDesign 3 года назад

Im glad you enjoyed it, it is my pleasure to share. Thanks for watching 🙏

@towniejude4359 3 года назад

As a software engineer dipping my toes in the world of UI/UX, I must say you have some of the best videos out here. And sure, an AfterEffects video will be well received. Subbed!

@JakePomperDesign 3 года назад

Thank you for your kind words, I’m glad you think so! Welcome aboard 🤙

@datibil 2 года назад

Thanks for this video. I got my UX design job after following your guide!!

@JakePomperDesign 2 года назад

Amazing! So glad to hear that and congrats on the job!

@made_by_eiji 2 года назад

I am amazed! What a great walkthrough! In this year, I began my career shift into Product or UI/UX design and this video gave me insight on how to present processes and deliverables. Thank You. You got one new subscriber 😊

@JakePomperDesign 2 года назад

Appreciate it, I’m glad it was helpful ❤️🤘

@quintonprunty 2 года назад

I currently taking a UX/UI Design Bootcamp with ambitions to become a Product Designer myself, and I gotta say, this is such an amazing idea, and a very clear and concise breakdown for the design process! You've definitely given me a much clearer idea on how I can anticipate take home challenges when applying for jobs, and it's much appreciated that you're sharing this process! It helps designers like me gain perspective on how I can implement my own design process and how to best utilize time provided. Thank you JP!

@JakePomperDesign 2 года назад

Really appreciate the kind words Quinton, I’m so glad you found it to be helpful 🙏

@robinpowell24 2 года назад

Awesome stuff as always!

@JakePomperDesign 2 года назад

Thank you!

@MrSpertuzm 3 года назад

DOPE!!!!! this video is so helpful!! I would love to see a tutorial on double diamond framework and the aftereffect tutorial!! THANKS for sharing this type of content

@JakePomperDesign 3 года назад

Thank you Sebastian 🙏 I’m so glad you found it helpful! Absolutely will dive deeper into the DD framework and UI animation in AE. Stay tuned and thanks for watching ❤️👌

@sanaznajafi5834 Год назад

Wow! So insightful

@MsKongful 2 года назад

Wao this is such an amazing case study, from user research down to the UI design. Can't imagine you doing all that work just within 10hours?! Thank you for documenting and walking us through, so so insightful. This is the standard I would aspire to be!

@JakePomperDesign 2 года назад

Thank you for the kind words! I’m glad you found this video to be valuable 🙌

@ClementCheng 3 года назад

Incredibly insightful, thank you for sharing your process. Perhaps it's just me but I can't believe that you were able to accomplish this much within just 10 hours! That's super impressive. I'm a +1 on future AE tutorials, would love to have a peek into your animation workflow!

@JakePomperDesign 3 года назад

Thanks man! Admittedly I probably spent closer to 20ish hours including getting the presentation assets ready and telling the story. AE tutorials on the way!

@codypearce9750 3 года назад

Really appreciate being able to see the full lifecycle here! I would definitely love to see some After Effects content.

@JakePomperDesign 3 года назад

Yessss coming right up!

@nakishacohen4361 3 года назад

You mentioned that it's a little much to add a take home assignment after presenting your portfolio, and I totally agree. I find that it is something a lot of places are doing no matter the level of experience you have.

@JakePomperDesign 3 года назад

Yep - it’s an unfortunate reality. Gotta ask yourself “what is this job worth to me” and go from there lol. I’ve declined plenty of take home tests myself for this very reason

@thamitayod-ngern26 3 года назад

I am graphic designer from China and I will do some kind like this app for ask to apply scholarships from the university in Sweden because a lot of Swedish was suicide in the winter season. It’s seems like from depression. I want to help them. I really appreciate your vdo. It’s really inspired me. Thank you so much 😊

@_felicia 2 года назад

This was SO helpful. Thank you for this.

@JakePomperDesign 2 года назад

Glad to hear it, you’re welcome!

@charlohink4505 3 года назад

This is awesome work youve captured everything no tutorial could offer....have a take home assignement i eceived today have a week....smae thing it will take 6-8hrs but its a complext app

@JakePomperDesign 3 года назад

Thank you. Best of luck, hopefully this will be a helpful resource for you 🙏

@huangshenghao5729 2 года назад

This is very inspiring to me, thank you very much🤩

@JakePomperDesign 2 года назад

Glad to hear it, you’re welcome!

@ChristianDavidOspina 3 года назад

Genius! If you did that with little research, imagine what you could do with full research and resources. I can see why they made you an offer. Great content!

@JakePomperDesign 3 года назад

Really appreciate the kind words Christian ❤️ thanks for watching

@emmanuelossai8625 3 года назад

This is basically all what you need in the industry in one video

@JakePomperDesign 3 года назад

🙏❤️

@peacefulmindmusic100 2 года назад

This was so helpful and thorough thank you so much for sharing. I wish Feelix were real!

@JakePomperDesign 2 года назад

I’m so glad you found it to be helpful…maybe one day Feelix will become a reality haha

@taz2392 Год назад

This is amazing! Prob better than about 4 boot camps I’ve been to.

@JakePomperDesign Год назад

I’m glad it was valuable!

@vineetboyle 3 года назад

Lovely video. Killed it.

@JakePomperDesign 3 года назад

Thank you 🙏❤️

@JosephLouisTan 3 года назад

Great content! Really helpful :)

@JakePomperDesign 3 года назад

Thank you 🙏

@Zee.M 2 года назад

Love your views and how you went about it.

@JakePomperDesign 2 года назад

Thank you!

@AliAhmed-ri5ty 2 года назад

In my life so far I have noticed that the people who help others selflessly, succeed more in life. All my questions were answered in this tutorial. Thank you so much and do you have any suggestions for ONLINE courses for UX/UI design for beginners. Would love to know your opinion.

@YourMajesty143 2 года назад

It's not entirely selfless, it's actually very smart to publicize take-home challenges to protect your intellectual property. I've heard horror stories of some designers not getting a call-back from recruiters and then finding out, that the company who was hiring, had taken their design work & implemented it as their own without the permission of the designer. Since it can be difficult to prove who the design originally belonged to (bc it was a quick mock-up sent over with the company's logo or brand style), this leads to alot of companies getting away with stealing. If you're not going to watermark your work or if you're being asked to send over the source file, then it's best to first post your designs online (preferably in an app that provides timestamps). It's also a good idea to embed code that prevents copying or that reroutes clicks back to you so that the company's CTR and engagement/traffic is mitigated. Nobody should profit off your designs without your consent, sadly there are unscrupulous companies out there who exploit hungry designers, so it's best to pre-emptively safeguard your work.

@isabellas5765 3 года назад

So so helpful thank you!!

@JakePomperDesign 3 года назад

You’re welcome, I’m glad it was helpful!

@loren.f 2 года назад

Wow. I'm just halfway through the video but I'm already learning a ton here.

@JakePomperDesign 2 года назад

So glad to hear it🤘🙏❤️

@jaski7788 2 года назад

Over the past two months I have been struggling to write a proper case study for my 3 college projects. I recently graduated from a course that partially taught me the basics of UX design, but did not teach how to write a solid case study. I am on my fifth iteration of my portfolio (hoping this is the last) and was really struggling to find a good guide that shows in detail what to add in a case study and how to present it. This video is absolute GOLD!!! Really appreciate you putting this together. So helpful!

@JakePomperDesign 2 года назад

That’s so awesome to hear, portfolio’s are always a challenge. Glad I could help in some way 🤘

@jaski7788 2 года назад

@@JakePomperDesign thank you for being so detailed in your explanation. Not seen any other video explain the process so clearly. I was wondering if I could run my portfolio by you for some feedback and review :)

@JakePomperDesign 2 года назад

Sure email it to jpdesignacademy@gmail.com

@jaski7788 2 года назад

@@JakePomperDesign appreciate it. I’ll send it over soon. Still got a little editing to do. This video is all I needed 😀

@bhargavpatel_ Год назад

Thank you so much!! God bless you

@SizweMoabi15 Год назад

Amazing video, you've just earned a new subcriber, I have a design challenge to do this week and this just helped me quite a bit. I'm curious as to why you did'nt use Figma for the protoype video, it just seems easier and more efficient, especially for people like me who don't have a lot of AE experience.

@JakePomperDesign Год назад

I definitely could have used figma to get the point across, but I would not have been able to achieve the same level of detail as AE

@jadentega9448 3 года назад

This is really nice and informative🔥. I clicked the subscribe button immediately. Great work man🦾

@JakePomperDesign 3 года назад

Thanks man! Glad you thought so and I appreciate the support 🔥🙏

@zuojianing1800 3 года назад

And I am curious about how you do your research, not only the plan, but also how you collect it in a real case and how you turn that into useful insights!

@fahimraffiee3323 2 года назад

Thanks, JP. I would appreciate it if you could share your case study.

@DabinIm 6 месяцев назад

Thank you for sharing your insight and experience! Super helpful! I was wondering if all take-home test should be presented in this scroll form or should it be in presentation slides? Would appreciate your thoughts on that.

@hirajainali 2 года назад

super helpful!

@JakePomperDesign 2 года назад

So glad to hear it!

@KayGee_yt Год назад

You did all this in a week with two other jobs?! I genuinely want to chat with Feelix now

@tori2040 2 года назад

Yes, I'm interested in you creating a video in after affects/ animation but make it step by step for a new designer and don't speed up the process because you might think it's boring.

@erzo9005 2 года назад

This is incredible - what you did in 20 hours rivals most junior designer case studies (including mine!)

@JakePomperDesign 2 года назад

Thank you!

@PetrAfanasyev 8 месяцев назад

20 hours? whaaat, crazy! 👍

@hemisgio18 Год назад

Your explanation was incredible! If I ace my UI/UX challenge, I'll definitely come back here and give the feedback hahaha! Thank you! Edit: thank you! I got the job :D

@JakePomperDesign Год назад

Love to hear it! Congrats on the job!

@hemisgio18 Год назад

@@JakePomperDesign Thank you so much!

@yannmarctenanteu4441 5 месяцев назад

Would appreciate a tutorial on how to do that ripple effect in figma coupled with your sleek animations.

@kartooncity1795 3 года назад

Nice man .

@JakePomperDesign 3 года назад

Thank you 🙏❤️

@md.imranuddin1052 3 года назад

Hi, could you please make one video for Invision Studio for stretch to prototype with complete a project? That will help how to crate header footer, component, responsive and more.

@PlusSe7en Год назад

This project is honestly incredible. I cant BELIEVE this company asks so much of their applicants, and honestly if you're there now you should really try to make a change here. 10 hours of work on a standalone app... thats worth like $1000+, and they are getting it from who knows how many applicants for just.. free? My guess is you're automatically weeding out some really top notch talent bc there's no way someone could accomplish this while having a job. Pay for the work or allow their case studies to speak for themselves.

@JakePomperDesign Год назад

I agree with a lot of your points. Not mention there was an additional whiteboard test afterwards…pretty insane haha. I got the offer but didn’t end up joining, otherwise I would definitely try to change the hiring process there.

@TokunbohSalami Год назад

Lovely video and full of insights. Thanks for this but i was curios, what if the user has other task on his mind he wants to discuss with "feelix" after the first task, i feel there should be a button beside the "no, not at this moment" button on the eight screen probably saying "Yes,i do". I'm a Junior UX designer, still learning and curious to know why.

@gladykim450 2 года назад

Please drop a tutorial on how to actually took adobe xd designs into AFTER EFFECTS and the editing process.The 3D animated emoji object looks so real and cool.It’s so surprising that you did all this work under 10hours.JUST WOWWWWWWWWWWWW

@JakePomperDesign 2 года назад

Thanks for the kind words! Tutorial coming soon

@lemonbuzz642 3 года назад

I have a design task where I need to review a website the company hiring has given me. The role is a UX Designer role. How do I go about reviewing the website? All they have mentioned is they want to see my lateral thinking, highlight the positives and negatives and how would I upsell any product.

@jordanalexander7177 3 года назад

You’re the best

@JakePomperDesign 3 года назад

No, you are!

@jordanalexander7177 3 года назад

@@JakePomperDesign oh no no, you. Keep up the great videos! I’ve been learning a ton.

@minhhuynh3332 2 года назад

great

@Mayo201991 Год назад

Hi Jake! Quick question. I have a take home design task were they require me to design the interface for an online student submission form. The form needs to include some kind of navigation walk through for the students to submit essays and projects. A typical University submissions page. I wanted to know if I was to do my initial research survey what questions should I be asking? Should I ask what sort of problems they come across whilst navigation a submissions page? I'm stuck with questions to write to ask students or if I should just look at other submission pages. Thanks

@shawshank_arts7778 2 года назад

If we want to add Information architecture, where do we add it like in what sequence ?

@pnksng 2 года назад

There could be a CTA for the an instance if user doesn't want to go ahead with Felix's first piece of advice but still would like it to suggest something else.

@JakePomperDesign 2 года назад

Good idea ❤️

@danielterceiro4449 3 года назад

This video is great, I just got one of this design challenges to take home from a interview and was asked to complete it in 3 hours, I'm facing the same issues as you, will other candidates actually spend more time? how deep should I go in each process? If I bring a quite long study process will they assume I went over the time frame? I would've preferred t just do it in person...

@JakePomperDesign 3 года назад

You’re going to have to make trade-offs. Depending on what they are asking, you may need to spend less time on research, and make more assumptions OR keep things low fidelity unless they specifically want a polished deliverable

@danielterceiro4449 3 года назад

@@JakePomperDesign Exactly, 3 hours for a commuting app is not a lot for a good process, but enough time to show what I could do with more time, I'm planning on doing enough research to justify my decisions and keep low fi, maybe one screen high fi to showcase colour theory, thanks for the reply and for the great video, awesome material !!

@yatingbai2957 2 года назад

how long did you finish this exercise? thanks

@rjabrm 2 года назад

Hi there and congratulations on the job. I had a very hard time accepting that you did it all in 10 hours... wow !! But I would very much like to know, how you would have handled it, if you had not been hired after all your investment and what you would have done in the end.

@JakePomperDesign 2 года назад

Thank you! It was closer to 20 hours all-in. It probably would have been a bit frustrating, but then again, it’s yet another case study I’d be able to use elsewhere. And regardless, I’m proud of the work and I enjoyed the challenge so that’s really what matters 🤙

@rjabrm 2 года назад

@@JakePomperDesign Thanks for your honest answer, I really like your optimism… but still, how do you deal with it?? Especially since there are companies that can potentially steal your ideas. How can this kind of thing be prevented?

@krishnateja5281 2 года назад

How would the integration change if users engage with feelix on slack(desktop), more like a chat bot may be.

@JakePomperDesign 2 года назад

Very valid question, yes! An AI-powered virtual assistant would likely work, pretty sure you could also build voice capabilities in a web app.

@seoulkimchi50 2 года назад

do you teach how to do UIs, and also animation? I'd love to learn and be at a level where I can think about idea and able to make prototypes and esp. animation like you did.

@JakePomperDesign 2 года назад

I have many videos on UI design!

@dejankeleman1918 Год назад

lol 10h and made their complete product designed, thought out, with future tech in mind (now with chat GPT this can be a great product) all that in one day of work 😄 let's not set up expectations space high, Mount Everest is okay but this is Stratosphere high in terms of expectations 😅

@juliagostina 2 года назад

Hi, do yoy have some projects like this but for a junior or a beginner?

@JakePomperDesign 2 года назад

You can do a quick Google search for “product/ux design problems to solve.” I wouldn’t worry about specific questions for beginners. Hope that helps!

@v.s.thakur7047 3 года назад

After effects course .... PlZzzzz, my company wants me to put animations on their upcoming mobile app, ,,, Would love to learn motion design from you

@JakePomperDesign 3 года назад

Coming soon!

@jonanthansalter9036 3 года назад

Wow great job. They really wanted all this in 10 hours???

@JakePomperDesign 3 года назад

Thank you! Probably not honestly but I tried to check all the boxes 😉

@27lee46 2 года назад

I'll learn to tell stories

@hanphyoaung550 Год назад

Did you really designed this with 10 hr?

@JakePomperDesign Год назад

Closer to 20

@bishtmahesh1 2 года назад

This is all you did in 8 hrs

@JakePomperDesign 2 года назад

Probably more like 20 tbh

@bishtmahesh1 2 года назад

@@JakePomperDesign for a senior designer role?

@JakePomperDesign 2 года назад

Yep!

@GalaxCFX 2 года назад

Sorry but I'm going to call bs on 10 hours for this. You created graphics for everything, organized all that data in percentages, animated... etc etc etc I think you spent more like 40 hours on this. No point in lying breh ;)

@JakePomperDesign 2 года назад

As I’ve already mentioned, it was closer to 20 hours all-in