Collaborative UX Design Workflows with Arsha Kiani – 2 of 2

July 24, 2019 posted by

[Applause] hey everyone welcome back to day two of Adobe live in XD my name is melody I am your house and I'm back again with our show kyani hey guys I'm so excited to have you back for day 2 yeah I excited be here yeah I think you're gonna do some really cool visual design so so I can't wait to see it you too yes it's gonna be awesome hello to everyone in the chat and thank you all for joining us I see Sarah's in the chat Joe cars Tim and Joe again yay hello hello everyone thank you all again for joining us and coming back for day 2 I see some familiar names hi pequeno today we are doing another chat and one giveaway in about 30 minutes so everyone that's watching at home if you are watching on be hands you should type something say hi ask us a question let us know where you're watching from and you can have a chance to win 100 free stickers from sticker mule and that'll be in about 30 minutes I know I Richard Kristen and Joe yay so excited to have you all here and today we are gonna be doing portfolio reviews at the end which I'm super excited about I love doing portfolio reviews and that'll be in about an hour and a half and if you have some UI UX projects on your B hands portfolio you can submit them on the if you're watching on behind so be a portfolio review tab and you can submit those there and we will be choosing two and reviewing some of your projects and giving you live feedback so how do you encourage you all to submit and really excited to see all your portfolios because they are so awesome and yeah hi Trisha and Emmanuel thank you all for joining us yeah so I'll pass it on to our shot do you want to like do a quick intro to yourself in case anyone is just joining us for a day – yeah sure so hey guys I Marsha I'm a designer from the Seattle area and I run outside called Keanu studios where I help tech companies with their product and marketing design so today we'll be doing part two of this FinTech mobile banking app and today we'll be working on the visual design parts of it so the look and feel aspect so we'll be like filling in these shapes will be doing color will be changing the fonts and all that good stuff I'm excited yeah where did you find those icons from from flat icon oh yeah every young thing nice oh that's a cool MasterCard all right no like all her dorm yeah I think what I'll do is all start with icons and then I'll go until I colors I know if somebody was like requesting gradients a lot oh yeah oh really yeah yeah you know I considered it and will probably do that actually Oh Tim you're gonna get your gradient say so why not you know yeah can you make your XD for scream oh yeah ooh Tim says lava-lamp gradients not those kind of gradients I think I know what he's talking about no it's probably gonna be like really subtle Google lava lamp design I'm kind of curious I just know like lava lamps I don't know what lava lamp design is I'm just getting pictures of blob Williams yeah maybe you X so anyone has anyone heard of lava lamp UX design oh I see it's like that yeah the like splotches of color and gradients and that makes no sense but you should Google lava lamp UX design I think it's good that you have to contact us as like a big part of the home screen because a lot of times in like banking apps the contact button or like help areas like hidden and way at the bottom or you have to do like a live chat before you can talk to someone or I don't know there's just like a lot of it's just frustrating yeah so it's good that you have it like right there no I was saying I tried to bring lava lamps back and had one at college in 2016 and it got confiscated really that's so weird the fun police got you yes the fun police so are these more icons to in the move money screen yeah so we're almost done with the icons it's like the most boring part of this but once we um because just like dragging icons over vote once we get into coloring this one the fun like will start now you know yeah I think I'm missing so my hunts too but oh my god you like for the loan I call and I'm missing some but I just use like the check thing is a similar that's okay Sarah had a glitter lava lamp in middle school that's cool hmm that is cool I never had a lot love limp yeah my friends had some I just noticed that there's no like bottom menu bar Oh actually made that oh yeah yeah you're gonna add that in we're gonna have it down oh okay I see at that law I notice that – yes yes oh wait where's the bottom our Tim's asking any reason for this specific icon set I just thought they looked good yeah I wrote like a back story generally like most of the things I do I just do it cuz it looks good Tim says it has pretty solid shapes Noel says they can't wait to see this with color me too yeah I wonder what colors are gonna use I wonder – oh you don't know yet no oh well I'm excited to see because that's a fun party you know I want to plan it out mm-hm all right I think it's it's for icons so we know when we're doing the camera all right I think that's it nice no prints no no five more this is the expense part so we're gonna adjust light so it's a breakdown so like this could be like rent and then travel and then this is health oh and food is this I don't think I have a fifth one so bumble you reuse or maybe find another icon what do you like other like that you can use like the credit card I don't know credit card one I don't think I have a credit line oh this one yeah I'll see that it could be like a random section random all right no I think we're done yes we're done okay so let's just update the fonts so for that for the numbers for the dollar like for the amounts I'm gonna do like a mono type of form before you get started you should add it to your character style so that you can change it once and it will change it all throughout your file so anyways so select one of your text that you want to change okay well who said the dollar sign one and then click the plus button on your character Styles under the assets panel and then right click this and then edit and then change like whatever font you want and it'll update all across your document so you don't have to go individually noise super helpful and is it do like everything that's like this yes on the next screen yeah so whatever like that size that font weight that you already have yeah it will just update that same exact style cool and if you want like a faster way of adding everything you can select the whole artboard and click plus under character styles and it'll add all the character sounds that you have and then you can update them like one by one but then it'll go across all your parts no yeah I'm just I don't know what the like can you like search sponsor yeah I don't think so okay okay I guess I'll just like it kind of searches for that font started oh be calm if you want alright I'm actually they're just like few minutes so while you're searching I can talk about the daily creative challenge in case anyone is interested it is almost over but if you want to sign up for the XE daily creative challenge we run them pretty regularly you can head over to Behance dog net slash challenge / XD and you can join and join our discord channel which I'll show you in a second but this week's challenge is to design a travel website and then take that into mobile and I was watching Howard a little bit of Howard's video before our stream and he was doing some like notifications and they looked awesome so today's challenge is to do trip notifications so I'm excited to see what you guys designed for that and I'll show you discord really fast sorry it's not full size so this is our discord Channel and when you're working on the designs you can post them and share them under the design feedback channel and get feedback from the community and people in this channel are super super nice and really good with their feedback and I see a lot of you guys giving each other feedback and that's amazing and yeah it's awesome and we looked at some of the designs yesterday so if you want to see that you can watch yesterday's video but we have some great we have some pro tips get getting inspired by different things and if you're working on previous challenges you can post that here since we do have like new challenges every two weeks if you're still working on them that's totally fine you can share that in this channel and then if you're new you can introduce yourself and if you just want to chat about random things you can do that here as well and then if you have any questions you can ask and we have some great moderators cares' in their high cars yes the community is really nice and then we have yo spam weasel I think I said that correctly and then we have some Adobe people some mentors it's a really great community if you want to join thanks Tim for sharing the link but you can go to bit ly /x the discord with a capital X and capital D game Uche foes joining right now awesome we have like 11,000 people in the community and it's amazing and there's also on fur Photoshop so if you're interested in a Photoshop I think that one is PS yes thanks Paco it's same link except instead of XD just use PS discord and that one has I think 13,000 Tim said which is amazing so yeah you Oh Howard always pronounces my name correctly well you let me know how to pronounce your name I'm sorry I said it wrong a melody I actually have a question so yeah this new feature you were talking about so like I'm trying to change this one uh-huh that's the same size and everything as like this but uh because this is a number I want to change it and when I change it it changes like the other one too how do you make the other one so I'll show you like all changes one the character mm-hmm and I'll do base mono and then this one changes too but I want to change this one to another word it's the same size I think because you you have the same font type and size it'll change everything but if you wanted to make that different I would change it to something else random okay yeah I'll do that and then yeah that's kind of tough if you want to do something different Josh without the H jaws okay jaws thank you for letting me know how to pronounce your name I'm sorry that I said it wrong is it working just doing like custom okay cindy has a question for you are shut she says you're really good with type size spacing in hierarchy how do you practice that and do you have any suggestions I would say just like experimenting and whenever I like publish something I always think it's like really good and then like four weeks later I'll be like no this is terrible because I'll look at really really good works you know and and know just like learn from that and I'll look back on my work and just like yeah and so like I just like through trial and error I cuz there's no like judge likes or like sound like I go somewhere and they're like oh this is correct yeah there's no such things it's just like based on you based on your own perception and yeah I'd say like if four months later like you look back and you still think it's good that's great and so that takes a long time like it took a long time for me to get there where like I would look back on my work and I would actually like it like four months that's good yeah so that's like a test that I use Roberts asking is there gonna be inspiration for the colors that you're gonna use no I mean inspiration for my mind but I'm not gonna like look at anything on mind yeah I'm just gonna mess around you know Joss is saying if you hold control you can select all the individual elements and you don't have to select them one by one I can do that but not if thought they're like in there's groups yeah Lana says they can totally really t varsha oh that's good I would josh says ctrl + shift maybe you can try it does he mean command system ech oh yeah command command shift oh thanks thanks Joss is it yeah thanks Joss learn something new every day that's a good tip it's gonna save so much time like from now on yeah thanks Tim for sharing the link for colored that's also a great resource if you want some color inspiration they just updated their website and they have like a trending page I think so you can see like different images and get color inspiration and it's really awesome you can search for different things and it's amazing so how they recommend checking that out there's a question for you from Musha they say are you a self-taught UI UX designer and how did you start learning UI and UX I am I'm totally self-taught and I learned why I learned like design digital design in general from just messing around with Photoshop like way back when I was like around 10 and so yeah yeah so like I just spent just a lot a lot of time like just messing around with all the different tools I would watch a lot of tutorials online YouTube blog articles and yeah just mostly through just trial and error and just messing around with it and then I quickly like not quickly actually like so I went into web design and then I had no idea what like UI UX was I got specific thing and so I just did like web design and develop it and stuff like that and then I read a lot about like UI UX online and then now I'm more like about apps as opposed to like websites and so I'm actually learning a lot about apps because it's like my second one so there are you going to like learn about like apps specifically so like websites so I there's a lot of like like resources online just like googling like a lot of stuff about UI you reading things about like conversion optimization like how do you make it so that more people that land on it would want to like interact with it and actually do the intended goal and so yeah there's a lot of stuff out there I think we're almost done with font stuff so what fonts are you choosing to use I'm doing Quasimodo was invader Quasimodo yeah and then we're doing base mono for the numbers hi Ali from New Jersey thanks for joining us all right I think we're done with that oh one more thing yeah let's do it let's get into color yeah yes we'll bring this to life I'm Elena's asking are using symbols in the repeat grid symbolism oh you mean I'm not using it listen youth yes yes so symbols is now called components but they are essentially what symbols were but a lot better because when you have your components you can have the main one and then edit the other versions and it won't affect any other ones yeah I'm using components for the bottom bar okay but I'm not using that for anything else and you can sort of bug yeah it's all right you can tell what's a component with green outline and you can tell that it's the master component with the green filled diamond in the corner and when you edit the master component it'll edit everything else tim says gradients I mean color yeah we'll let that don't worry all right so I'm trying to pick like like the accent color the main color and I'm in-between like blue I mean green like bluish green and like purple mmm so I'll probably mess around with both of those and see them in action do you ever like grab like a bunch of colors and I put them together to see how they look together or do you just kind of sometimes what I would do is that like I do it on the actual interface itself so I I would like do this and then I'll SiC pick the secondary color and see how that would work out and then I'll like duplicate it and try another color color set yes I like to I like going on Pinterest or like a dribble or Behance and getting inspiration you know for like color palettes I'm just by looking at like I just type in graphic design to get like color ideas and then once I have like some things that I really like like either print or anything that I really like their colors are like drag and drop all of them into XD and then make little squares and then use the eyedropper tool and grab all the colors and then like see which ones I like yeah you got to sometimes I think it's oh cars needs our help how can I say your flight is ready in a creative way whoo Joss ready for takeoff that's what I was thinking – up up and away that's also a good one oh hush was saying they relate to you on messing around on Photoshop and they just finished their undergrad and graphic design and they're learning UI UX at home and waiting for the moment when they're confident enough to share their work I think you should share it right now you too may be shared like as soon as possible so that you can get feedback and you want criticisms because then you'll know what to like improve on yeah like what people like yeah they'll probably pick like a bluish grayish color for this yeah yeah yeah that will be the first option and then I'll pick the second option then we can probably get like people to vote like oh yeah one or two I might even do like a third one okay yeah let's do that I think that'll be fun no not this color oh it's time for a chat and win yay a countdown is done so yay so if you guys haven't typed anything in our chat on B hands say something right now so you're gonna have a chance to win 100 free stickers from sticker mule let us know where you're watching from and we have a chance to win and we will be right back whoo-hoo and we are back I saw a question about accessing colors or color libraries on X T and you can do that from creating a palette in Illustrator or Photoshop and then you can access the libraries on XD but you can't create them in XD yet we have Missouri Spain Washington State Chicago Germany the Netherlands Brazil Pakistan cool we have a winner Joe door goo congratulations yay you're gonna be receiving 100 free custom stickers from sticker mule and someone will be in touch with you on began Stu share some more details about that and for those of you that did not win to cancel get 10 stickers for only $1 if you head over to this link sticker milcom slash Adobe Live 19 and that's a great way to test out the stickers as well Oh null says area 51 we have London Denver Wisconsin Italy Dana I just got back from San Francisco nice we are in San Francisco right now right should we get back get back try think what else would be a good secondary color for this what is this teal what would you call um I would call it like turquoise turquoise or teal I feel like they're like kind of the same color is that like a really light purple yeah like a little bit hard to see on the screen oh is it yeah it is hard I could probably like make it darker I think it's so that it see things fun yeah dana says teal turquoise love it you want to pick the third one oh yeah hmm let's do like a blue boys we have like teal and purple what kind of blue like hmm should I choose on here um I have no idea kind of like this yeah let's do that one was like a white text all right I don't know I like it let's see what goes good with this joe says Dodger blue with the hex code Dodger blue yeah so with the sannyasis sky blue I don't know what Dodger blue I think that's further Dodgers LA Dodgers I think they're yeah oh thanks Tim for making the straw poll so everyone watching vote which version you like but once our show chooses a secondary color so you can vote one two or three so one will be the one that's like above me and then two and three all right this way ooh go Rafi says a yellow bread the secondary color royal blue I think that um these are a bit darker I'm trying to go for like a light really light color for the secondary what do you think do you think this looks good it's like a brown like light brownish type of color yeah all right I think we should uh yeah let's do the pool yes can you make the font a tad bigger like where it says open an account where does it say that oh I'll break out yeah yeah we can make that bigger like um Tim I like how you named the mr. awful green ish nice so yes everyone head over to the link that Tim posted the straw poll link and vote on which colors are should use one two or three and then I will share the results every guy changed swim oh it's still a whole petaca oh yeah so yeah sometimes I drew that where I'll change all my other fonts and then forget about the button the buttons the most important thing yeah that will be in the corporate style guide greenish yeah I think everyone will know what that means okay are they vote so they are voting the votes are coming in so if you haven't voted yet be sure to head over to the straw poll link that Tim posted on behance and vote let us know which color you like best one two or three and one is this one and then two and three so let us know maybe it will wait like a few more minutes and then share the results whoo it's pretty close it is you don't don't know yet it's gonna be so much time we're gonna give it um let's do like two more minutes okay haven't voted vote right now it's a it's a close race and I don't know who's gonna win so for your whole app will you be incorporating more colors or just like – like these – like these two colors I'm probably gonna go with these two but I don't know I might change my mind what do you think do you think um she died another one um I think like two is good but I'm wondering about like your bars yeah those like what that's the one like I was thinking like what could we do with this cuz if you do like the dark one I feel like it's kind of overwhelming to have like that dark of a color like so much you know but I guess we'll just play around with it and see can you zoom in a bit yeah for sure the votes are still kind of close okay it will give you all 30 more seconds to vote and then I'll be sharing the results we have 25 votes so far add a third what do you mean we have a theory yeah I think it means forth maybe maybe okay okay I think it's time to look at our results for the straw poll thank you to everyone for voting oh wow we have a tie that just happened right now so blue has ten votes and greenish also has ten votes and then purple has seven I'm gonna go with greenish okay yeah cuz I like the way header nice thank you to everyone for voting and parking studies in our poll Danny says we can vote for all three so we don't have to make a choice Oh Mushka says they mean add a third color so add a third color we might do that going off this one and then we'll probably add a third well maybe like the bars or something oh yeah you can close the creative cloud libraries alright you're gonna use them anymore but save space I think for the sex the third color will probably do that like as the fill color for like the the icons and like the text so I'll probably do like something like a purple or something like a dark dark ish yeah Joe says green and glue green and blue can work together Oh what happened you can get oh you know what you can do yeah let's add this black color to your assets panel acids fatty acid is that oh this one and then oh you character selfies colors and then right-click it and make it that purple color and it'll change all the block to popping oh man yeah that's crazy I just like wait it's not doing it though it's not no I just did that and it didn't change it is that a different shade of black on the icon I think it's not regular black um okay try adding that to the assets panel again under colors and then maybe try changing that I don't think it's a gray I think it's like the thing under that oh let's do it again nope that's not doing it I don't know hmm just we'll have to do it manually that is very strange oh thanks Danny so it says that you renamed the asset color but not the changing the color so right click on this and then edit and then change this to that purple color and then it cities the words did that work yeah and then right click right click edit let's see didn't work what's the weight let's hold on I think there's multiple layers to this so what about that is your text color zero zero zero also in the text yeah yeah okay but we're changing – yeah – listen you won I guess for the text we can probably do that colors oh it's three three three oh that's yeah that's different no the icons though there is yours – zero yeah see it does it for the text but doesn't do it for that because way to change everything yeah which is all the text if you want to do that or no actually we might just do that but I do want some of the text to be like different mm-hmm so let's see if that works yeah it does great thanks Tim for the reminder so in about 43 minutes we're gonna be doing some portfolio review so if you have some ui/ux projects on your be hands portfolio you can share that with us on behance under the portfolio review submissions tab I can't remember the exact name but its portfolio submissions our portfolio review but click on that find out more information on how to submit your link to your portfolio and we will be selecting two and reviewing them at the end of our stream what happened I just did that for the white and just everything oh no cars if you have at least two projects or even one I think you should still submit because we can look at one if you have like a longer one I think just one is fine and you can still have a chance to get some feedback all right let's um work on the fields now so we're gonna probably not gonna do that border probably do like a drop shadow or something let's see how that works how that looks I don't think oh what's up I was just thinking of something random Oh something random yes that's cool I thought for like some reason that you couldn't add a fill so you wouldn't be able to add a drop shot I don't know why but I think I was thinking of you can't add a gradient to a border and I think that's where my mind oh yeah but nevermind you can like is that gonna be like a few trips actually I was looking at that um I think you got some time people are voting on it on user voice I think it's user voice too XD Tim maybe you can share the link but if people have any future ideas or feature requests for XD they can submit it on that site and people vote on it and I think add ingredients to borders is like one of y'all put on that actually yeah do that oh thanks Tim it's Adobe XD user voice calm I can never get the order right on that link Joe asked what is enough it's not show no shadows yeah just so subtle maybe is that just for that like um screen or is it like Universal like everybody let us know if you're watching if you can see this drop shadow up here I don't know what Randy but don't let us know if you can see that if they can't maybe you can change like the background color of your artboard I don't know if that would show I could make it darker like um what are they saying no one has said anything no one is say ok sam says barely barely okay I think that's Mike yeah cuz we can't see it here but they can see it barely and it's supposed to be barely like it's supposed to I like Josh just uh Josh says we see the shadow pretty cool oh great but car says barely as well yes no boy it's a subtle thing it's a really really low opacity like them it's literally like 4% on the opacity yeah so um I did that on purpose but so we can't see it but I think they can see it I think on this screen maybe like the brightness is on here yeah can't see it on the screen that everyone's seen yeah see a very very light exactly so they see it that's good it's all about subtlety you know like I want to be too crazy with the shadows make it too dark and then still need to add like a triangle to this so that's a 10% up or down you know I just like 10% forgot to do that yesterday oh the program monitor your I'm looking at is not properly calibrated and to blame pocket null says no man keep the shadows at eighty percent opacity so let's see what that would look like actually oh yeah looks great okay Oh angel is asking a question why not move the finger print button to the right as we are mostly using our phones with our right hand finger print icon yeah we can do that no let's do that well I suggest you like I'm right-handed so I use it with my right hand but I wonder if like people that are left-handed alright hold their phone in their left hand I guess you can say like from that like what how how many people have right hands versus left hands I think right hands work up any more people right yeah um let us know in the chat how you would like hold your hand hold your phone because I think for me it would be like a struggle a little bit for me if I'm holding with one hand to like tap that fingerprint cuz it's usually at the bottom of the phone and I think once it's at the bottom it doesn't really matter if you're like right you're left-handed because it's like in the bottom yeah yeah yeah it's like Oh Ali says I'm a lefty and I usually use my right hand interesting I feel like I can't I can barely type with my left hand it's very difficult Joe says my bank app has it at the bottom Center all right on the third screen I'm thinking of changing the teal to maybe like a darker color or not no let's keep it yeah timΓ­s talking about using face ID for bank apps and the bank app I use uses face ID to open my account which is really nice and convenient for me because I have an iPhone 10 so there's no like thumbprint section anymore and also I like never remember my passwords especially for my banking app so I think I like using the face ID yeah face ID still works in the dark but I feel like if it's too dark it won't work so you would have to like turn up the brightness on your phone I think that'll help that's weird so like it doesn't do this shadow for this did you do paste appearance paste appearance yeah so go to go back to this rectangle and then copy it and then just the actual rectangle yeah okay and then go to the rectangle that you want to change and then right-click o paste appearance yeah yeah yes I'm really picky on my drop shadows not ingredients oh oh yeah are you gonna add gradients I will I will like um you really have to do it for Tim yeah we'll do it for this for sure like the income expenses and it'll update him everything michael says face ID works underwater i have never tried it i have no idea but it wouldn't be funny to see if it does if I'm underwater I probably won't be thinking about like my bank yeah moosh was asking how long did it take us to get used to using XD like probably like a week yeah probably less actually cuz a lot of a lot of these softwares like pretty similar because you're trying to do the same thing yeah for me feel like it was like a year and a half ago when I first started using XD and I want to say it took me maybe 2 weeks of practicing when I first started it was still in the beta version so it was so fairly new and it had like one-third or one-fourth of the features it has enough so it was a lot easier to like learn everything and I remember like going on YouTube and searching for any videos that explained like what everything met like on the panels I think that was the most confusing for me is just knowing what each thing does and once I like used it because I was using it for a class project and I think after like two weeks of like regular use I felt pretty comfortable with it and then I just kept using it and yeah so I think you can definitely get like pretty familiar with it very quickly and now there's so many more tutorials and videos that will help you so it's a lot easier to learn it now than it was back then hi Brianne thanks for joining us vishwas says does anyone else lose it when it's typed as capital X D like I am and are like I have experience designing or laughing or both yeah sometimes I picture like the laughing I don't know if it's called an emoji but like the X is like the closed eyes tim says getting started and XE will take you about 30 minutes mastering it will take you significantly longer that is true yeah does take a while to get used to everything and get used to the keyboard shortcuts I still forget a few of them but yeah like I said there's so many there's a lot more resources available now which makes it a lot easier and I think just practicing and like doing the daily creative challenges is also a really great way to get familiar with all the different features of XT so highly recommend you join me Tim says XT is not an emoji thanks yeah Howard Pinsky suit Orioles are amazing if you do need more practice I would highly recommend doing the daily creative challenges and there's gonna be a new one starting on Monday if you aren't already doing the one right now and that was I started doing the daily creative challenges think like last April or May I remember when they started but I started doing them and they really really helped me learn all the different things that he could do and I just got way more familiar with all the features and yes so I would highly recommend doing that and if you haven't already checked out Howard's website let's XT comm is also a really great resource he has all of his tutorials there as well Oh Joe just started and this DCC is their first xt project yeah yeah that's really exciting do I like the green on the dark like gray yeah we're gonna do like this is gonna be like the logos or like the descriptions and stuff like that and I don't know for like I don't I don't think we're a lot to use like the actual logos and stuff where I'm not sure about that so I'm just gonna use like the just locally abbreviation this is gonna be like Spotify like I like Spotify screen color yeah and they got a really good design yeah excuse not an emoji it's an emoticon thanks to I knew it was called something I also reminds me of Shopify Shauna 5 yeah yeah oh yeah but they have like green and white or something right I have a sticker I don't know can't even see it but it's like it's like the similar shade of all things here's my notebook oh I have a Shopify sticker right here and it that's like the same dream and that's an S so I just wanted to show what should we do for like the second um a piece of piece and that's right um I would do at the same dark color and then just like a different names color OSS no I'm gonna yeah so it's gonna be like Spotify I'm doing another subscription so um probably not not like black or let's do like Netflix Netflix yeah it's a common one so red and white okay the third one maybe someone in the chat can give us some suggestions what's something a subscription that you pay for monthly that we can use in this Bank app but after this we're gonna get to the gradients Oh gradients I'm excited for them yeah oh thanks Michael I'm glad you enjoyed it and thanks for watching yeah have a good weekend Adobe Creative Cloud a lot of people are saying Creative Cloud you can just like see what's the white and red yeah well maybe well then the white wouldn't show it yeah you're right let's see something else linkdin Hulu Apple music what color is Apple music it's white and like a variety of colors like like got love below a lamb I think Oh class pass that's a OB hence list that oh wait do you you pay for Behance oh no no you don't pay for itself yeah um oh a car payment that's a good one or payment alright Amazon Prime Amazon Prime that's like is it let's see that thumb be sharing the gym I feel like this color is like the classpass app color I really like the shade of blue that they have what's class it's like an app where you pay like monthly and you can try out different classes like gym like workout classes in your area I've never tried a class but I really want to one day is it just gym or is it like other stuff too they have like yoga Pilates and like spin classes and a bunch of other classes nice public television oh headspace that's also another oh yeah headspace I love that way finger okay um we're gonna do the greetings now so ooh Amazon's official colors orange yellow thanks for that hex code oh you did what do we pick what's the blue thing yeah prime right yeah a prime it's orange right yeah well with a private light blue oh it's light blue I see her at Whole Foods it's like um like a sky blue sky blue I'll be like like this like lighter um we zoom in I would say like a touch lighter touch later Oh Squarespace is also a good one t-mobile yeah I think that's pretty accurate web hosting yes that's another good one okay it's gradient time Oh Tim let us know what color gradients you what what's your favorite gradient color combination you think you're gonna stick with like the teal I don't know might change the tail on a rough like I like that too much or like maybe even like maybe the whole thing actually that her as I do that a lot of like I'll pick something and then I'll just change everything really quickly ah thanks Tim I just typed in the hex code for prime this is what it looks like I was kind of close I don't think it's alright I'll do a zero one a de to zero one ad e to me too yeah okay that's pretty close sorry do you think you'll use like a different gradient for expenses and then a different one for income to kind of like show that they're different it's great yeah I was thinking about that because it doesn't make sense with like the expenses being like green and slight positive you know thing but uh arrow like if we add like red don't be like another color what do you think mm-hmm we could like mess around with it yeah I think I think you should definitely use a different color because at like a glance going back and forth through the screens it would look the same so Oh tim has a suggestion for the lava lamp gradient I'm gonna try it on my screen so you won't have to okay oh I think I think I'm gonna just change the entire culture oh well like something else but nice hot pink color for that first one hot pink are you trying it I'm trying to suggestion okay it's like a sunset gradient oh thanks this is Tim's gradient suggestion for a lava lamp gradient oh we could try that for like the expenses yeah this is cool thanks Tim ooh there's a suggestion to inverse the gradient for the income let's do that I think first I gotta decide on the colors do who thinks cars for the reminder so we are doing portfolio reviews and under 20 minutes now and if you haven't submitted your portfolio if you have any UI UX projects on be hands feel free to share that in under the portfolio review tab on Behance and we're going to select two and give you some live feedback so I'm really excited and I hope you all submit even if you have one or two projects you should still submit your portfolio Oh any think about that what do you think about one yeah right yeah okay look what's that looks nice with the green yeah we could have like the green be for like the numbers and then we can make the CTA or like the buttons we can make that like this like the primary one mmm I think I like that right I do too I think for me I would be kind of confused if I if the like the button looked the same as the bars as far as that I could like click on them is that like what you would be able to do oh yeah you're right I think your idea so actually you can't click on it yeah I think the way I wanted to make it is like you click on them and then it would expand it goes to another screen that we have inside okay and then that screen would show like the break lecture like come and break down yeah that month it's more specific okay cool I think that would work then I'll change this one too or just change the colors though what are you gonna change it to um I'll be like this color yeah light light blue no I don't know try adding the purple to the assets panel and yes George let's do that perfect yeah awesome cool I like how that looks alright so we we did one – oh wait we got something let's actually do that let's put on the right okay so for the expenses oh hey this is expenses so I come shoot okay well we'll change this the income and then we can think about like well I guess if we're making this red then this shouldn't be like the button color yeah I think I like green for income because that represents see that Oh Danny says I just found out the other day you can add the gradient to be an a color asset and yes you can so you can add the gradient into your assets panel so that if you want to use the gradient somewhere else would you be able to do like like verticals and horizontals some of them like it's horizontal oh yeah let's try it that customizable but well cause like this is different anyway so I think it's just gonna be on this screen so I think we'll just keep it otherwise like if there's like other screens we could we could have that we could do that on on that I think we'll just keep it I think we'll do like a really subtle one for this just like kind of blueish yeah let's do that yeah and then so this income so then I'll like pick no see the top one yeah okay and then expenses I guess let's not do purple let's do reddish what was that color that was it Tim oh yeah muffin tins Tim's lamb color yes FD seven nine three four and then well that's orange oh sorry the pink one is f8 279 e oh that looks good yeah I like that yeh thanks Tim okay thanks Tim we're using your gradient I should have selected everything okay alone you cannot add the purple – oh no nevermind yeah what's the color again uh I guess I can just like you see yeah you can do the eyedropper Oh a website I think so the purple one is f8 to f8 yeah okay SJ 2 7 9 e that looks different oh wait yeah breanne really likes the purple gradient I like it – yeah we have a lot of cool gradients I don't like this one though really a little bit yeah something about to say I can't get alright with like the combo like I can't figure out something that's maybe this maybe like yeah more greenish color mmhmm yeah yeah you asked it no I like how you just say no thank you I just have a feeling yeah that's thing like I just like I don't have anything a compared to it's like really yeah I'll look back you know zoom I do a lot of like zooming out of zooming and zooming out do you think if you're like stuck or in the past if you've gotten stuck with like color decisions would you go and look like other existing apps for inspiration or like other outlets I do like what you do you want it going on Behance and looking at like cool projects or like there's like this think color hunt do you know it I don't think I've ever used we might know I think we're good but I should have done that before but I sometimes go there he's pretty cool they have like color combos yeah I think we'll leave it at that that's good I like it okay yeah like zooming out you can see like no the pink and red oh you know I think one more time one more time and that cuz I don't want to like waste too much of this alright it's very interesting to see your like design process with like choosing colors I feel like all of us we go back and forth a ton with our decisions where we're designing so good to do that yeah it's like it's cool to see someone else doing it let us know in the chat if you often go back and forth with your color decisions Oh Josh says color ha and call it cool or I think that's I say are my favorite sources for color palettes okay I think I think I like that what do you think oh yeah I like that yeah it reminds me of what your first button looked like that green yeah it is that that's what yeah okay so let's do the rest so in about nine minutes we're gonna be taking a look at your portfolios so if you haven't shared them with us yet you can do that by clicking the portfolio review tab on be Hance and share your link to your piense portfolio nul says they're always going back and forth with color especially since it is so subjective yes very true who everyone's saying coolers as I don't I think I'm saying that wrong but I need to go check that out coolers what's that it's like a color sight I think it's like a color palette inspiration yeah it sounds like it super fast color scheme generator oh nice I'm definitely gonna check this out thank you thanks Tim for sharing the link also Mishra says of course going back and forth is part of seeing what works best and also helps to ensure you go the extra mile with your design by trying out different combos yes very true that's very true yeah I like when I'm designing and I'm trying to decide like different things either placing things in different areas or different colors I keep my old versions and then make new version so I never yeah I can like look back and see you oh I've tried all these things and now I'm here and it's a lot of times it's a big difference but sometimes I'll like something that I did like on one screen and then I can go back and I think it's nice to like keep what you have done in the past yeah the old stuff yeah you can see thanks Mara I just looked at it on my laptop and it's a great website so I'm definitely gonna look at it when I'm deciding my next project all car says I always look back on my whole design and I want to throw it in a trash can I do that too with some of my older designs but I think that's totally normal it is yeah yes I'm insane about like I do that a lot I think that the more you do it like I was saying this before like you you'll get to a point where you want to do less of that you know the throwing in the trash thing initially like I'd say like first five or six years I wanted to do that with like everything and then the intervals between like when I looked back yeah and how much I hated it like it got less and less I mean got more and more like one thing you mentioned that at the beginning though you can look back at something you did four months ago yeah exactly exactly that that took a long time till I get there cuz I would always like do something I'd be like how it was so great anyone like oh this is terrible like two weeks later me too I do that a lot but I think it's good to keep looking back at your old designs and you can see how much you've grown as a designer and where you are now is completely different than like the designer you were like six months ago so exactly like if you don't do that I feel like initially especially initially like if you're starting out like probably like first one or two years if you're like always say oh it's so great then you may not be like growing so it's good I think like Kelly you says I get to like actually say about your own work like I think it's it's bad and then try to improve it yeah exactly wish was asking what are some of your favorite color combos everyone and we have greens and blues and earthy tones Joss likes a color palette for their own site I don't know what color palette that is Tim says hot pink wait hear me out and orange like we're using Tim's gradient recommendations for the expensive the screen Kujo says they usually start with a mood board focusing on pictures and then find a picture that inspires me and uses Adobe colors picture function to get my color scheme that's really cool I like doing that too like getting pictures of things and also colors and kind of getting inspired by that is really cool I just realized you guys have circular so when I wanted to use but couldn't find oh I think I want to change everything let me see if you guys have the other one too that was looking at the space mono no it doesn't look like it it's fine Tim has a good tip if you want to make any color combo pop as the art director say put them on a black background Oh Susanna saying this is also true of writing saving multiple versions to grow and involve as you look back hopefully not and discuss yes that is very true whenever I write the first like version is horrible but I just need to get everything out and you know just type it all out and then like revise and shrink and take away things that shouldn't be there and I'm looking back at the first version from the final version it's like wow what a big difference but then it's so good to see how you've grown in that so I think it's true with like all creative things mm-hmm yeah I agree Joe is into black squeeze and a pop of outrageous color and now I'm on Bondi blue and Vermillion ooh I don't know what color vermilion is do you know ago vermilion that sounds kind of familiar but anything I know it is it's like a reddish thing I don't know it sounds like the name of a bug bug like a reptile or something sounds cool it sounds like like an ocean blue color what blue Bondi blue Bondi blue yeah there's so many blues like I don't know miss nice by name you know Lindsay says Vermillion isn't that a deep green Susannah says reddish orange a reddish orange cool I guess right if that's right yeah oh it is rigid varnish orange sweet it's a brilliant red or scarlet pigment originally made from the powdered mineral cinnabar interesting hmm yes it is a very rich red cool it's almost done yeah I feel like I wish had more time like something with these like colors it's like bugging me I like the purple I love the purple good I don't like I like though I like the orange I like the red I like this gradient a lava lamp thing that Tim mentioned but I just don't like this Greenlee I don't know what it is just don't like it I will keep it because I don't wanna spend too much time but it's bugging me okay maybe once you finish with this project you can upload it to your behance oh yeah I was planning on doing that yeah that's cool to see like how it it'll change once I like have more time to work on it you should everyone should follow our Sean Behance I think his links should be there it should be on when you're watching on be Hance there should be like a button to follow him but maybe Tim can also post his baganz profiles but you have some really great projects on there thanks mom so just about 30 seconds until we look at some portfolios I'm very excited so after the portfolio is that the last thing we're gonna be doing mm-hmm okay it's like a few more minutes for you if you want another okay wrap anything up but we're almost done I just like here like we're gonna it would add pictures plug-in you can use for that for they'll be stock right um it's firm unsplash let's pleasure I know what but there it's called photo splash and photo splash how do you do or actually sorry for faces there's one called UI faces okay and then so if you go to click on this I think they're binoculars I know it's a plug I I feel like they look like binoculars so click on this for plugins and then push I think you have to push up okay first right here and then push plus and then or discover it and then you can search for UI faces and then this plug-in will allow you to search for or like add any pictures of people's faces there's also another one where it's like not a real person or something I don't know the name if I knew one knows the name of that plug-in I wonder if I have it on my XD it's cool how do you how do you like okay so now that you install it exit out of this and it'll be right there so you can select on that circle and then you can customize where you want the source to be from like unsplash or any other places this is so cool and if you want male or female or like what their emotions should be that's Billy says yeah so they're all gonna be out yeah why would why would you make it neutral no maybe it's a serious one inking its cus I mean it deals with certain like money about it's like it's some formal a shinobi yeah he should be happy yeah okay randomize optimize I mean I don't know optimize means you can just do apply faces lie faces yeah so I think since it was a repeat oh do the same one but you can ungroup it but I know one group a repeat crit that's actually right click and then ungroup Oh see if you have to click out and then click back in because I think about yeah and then click it should be so umm click out of this again and then click once and then you can go to the top corner remove yeah okay but we have to actually get to our portfolio reviews so thank you to everyone who shared your portfolio's we are gonna take a quick trip into outer space but we will be right back and we're gonna take a look at some of your portfolio so stick around for that we are back we went on a quick little trip to space and it's cold in here yes it was cool was really fun saw some aliens I'm just kidding umm but now we are back and we are going to look at some portfolio so I'm really excited I'm gonna take this off because yeah like you can't really hear me talking you can take yours off where you can keep it on totally up to you you'll keep it on okay nice oh cool so let's get started so Josh yay we're gonna be looking at your portfolio so josh is a web designer slash developer freelancer from the Netherlands yeah yeah you love designing coding and solving problems awesome if anyone is looking for work you should hit up show us so let's take a look at your projects this looks really really awesome mmm is there one is there a project that kind of sticks out to you that you want to take a look at I like that um purple one let's go that was fun yeah see so it's a landing page it looks like yeah I think is this your portfolio landing page Jos let us know so like the illustrations is this from undraw because if it is I love it I'm drunk what sun draw it's like it's a plug-in on XD where you can get illustrations what as I got none of them it's crazy how many plugins me I said there's a ton of plugins and there's like new ones being created and added all the time so yeah I haven't tried all of them because there's just too many but I love the plugins on XD this is cool I like how you organized it this way icons and you kind of centered everything and you're letting people know all the tools that you are familiar with languages I speak so for this section would this be like the hover State let me know orb-like probably like maybe this is the main thing this best one yeah his main skill yeah it's kind of like a pricing table it sort of reminds me of right yeah that's cool Morris says why do I feel like purple is our show's favorite color it is my favorite color is yes right that's funny yeah this is awesome this is really cool do you have any feedback for address on this did you scroll up all the way to the top let's see hire me see work I would say like um they're kind of like similar styles like I would like fill in probably the hire me to like just to show like what's more important so that like one of them could be a secondary one of them could be the primary if that's like if you have like too many buttons you know then you know have too many buttons but I generally like I like to do that and then that like what does that teal that color I don't see it like anywhere else I think right I do like how you like oh I see it there yeah I like how you accented those and you can go down oh and I like that like pricing table like the way you set it up like that because I've never actually I've never seen that before so that's a pretty cool way of like displaying info because I've only seen that like done with pricing tables so I think yeah I think that's it could you like all the way back down and then like though let's work together I would say like make that up button and it's I should be like filled in so that it's like the main CTA yeah I think so I see that name is above here so I think that once you like click on this it'll like move to the top and I think that's really good because sometimes when you click into something and that whatever text is in there it's removed you kind of forget what you're supposed to do so I think it's really good that you're thinking about that as well but really great job let's look at another one really fast is there another one that you want to look at let's go do that like red and dark grey one this one yeah actually could you like scroll all the way down and see us all it works okay yeah let's do uh that one Vance nice I'm wearing vans right now I like the way you presented things yeah oh this is cool like the story over here in the corner let's see if I can make this bigger like the colors oh and I like how you explained why you chose those colors because I don't really see that very often I just see colors but no real explanation so great job ooh this looks really cool I like this a lot better than the last one it's really good yeah this is really cool yeah Tim if if you couldn't tell I don't I'm not the biggest fan of the astronaut hell I like if I hate says our she likes a straw helmet I think some cars I can't hear myself talk when I'm wearing it I just take it off I like this like believe that like follow on Instagram so I'm imagining that when you hover over like the social buttons it'll like kind of expand out and yeah I think that's cool and it's cool that you since it this is not like an animated gif or video I can still kind of see what the interactions will be like on this website and I think you do a really good job of showing that on your project so really great job Tony Hawk you have another great call-to-action at the bottom so once the users all the way at the bottom they have something else that they can do which is great when you do have a video that's close this is awesome whoa great job keep up the amazing work Joss this is amazing let's look at being next have this is from khushboo punch all and they are a front-end developer from Fremont California that's really close to where we are in San Francisco cool let's see is there a project that you want to look let's look at that travel website this is um the XT daily creative challenge that is going on right now and it ends tomorrow sadly but this one was a fun challenge so I like how you are displaying it already what's that you really like months right yeah everything said I think yeah it's a great fun actually can we see like the left one the other project I feel like that one might have more to it yay this one was the XT daily creative challenge that I hosted of back in June so awesome and it was a food delivery app again this looks really cool I really like how you kind of focused on the different features on this and explained what they do and why you are showing them and I think that's really important to kind of explain your design decisions on behind I think it's like different from dribble we were kind of talking about that yesterday we're on dribble you kind of just show like the final result but on B hands it's like the process may be things that you tried that didn't work out I mean I think it's like cool to see that as well so this is really great ooh I really like this feature calling them if there is a problem with your order because I was one of the challenge prompts is your order got delivered or it's going to be delivered to the wrong address and how do you fix that and that can be a pretty bad problem to have but I like that you have thought about that I think I would just make this button a little bit bigger and then maybe a different color because I see that you're using it to select the filters so I think this one should be a little bit different so it kind of stands out a little bit yes you have like yellow – you could probably make like the orange where you select the things like the filter you probably make that the other color like the yellow or something and then orange good because it's like darker it could be like the main buttons yeah Tim says is that papyrus cars oh no it's a cry oh that's really funny and it is papyrus and also Futura I like feature oh yeah first rule of Adobe live Chloe don't talk about Comic Sans second rule of it okay let's look at this which bus says what if someone is a comic book artist they kind of have to use it that's true this looks really awesome and I like the progress bar for current order I like to see when my food is gonna be arriving yeah I'm hungry now delicious pizzas yeah this is a really great good job you definitely put so much detail into all these different restaurants and making sure all the different features were there so that the user would have a really nice and easy time ordering their food so you know awesome job and I'm excited to see where you take the travel challenge because I just saw the first day which looks really really nice but I would like to see the continuing days and if you don't finish that's totally fine but yeah I think this is a really great start for the chaplet challenge and yeah thank you thank you to everyone for submitting your portfolios we couldn't switch it back over to you I don't know if you want to give the final details yeah yeah let's do it we'll probably work on the cards car says we want more dad jokes yes we've had a lot of dad jokes I think it was last week with Chris Thomas who was here and he was designing a dad like pop culture app and we had a ton of dad jokes which was really awesome it's kind of late to change the fonts but I you know I just for the screen see what another no yeah that wish you guys had space mono where where would that fun be available I I don't think it's a Google fun I think it's a custom like font company Oh hungry is it yeah yeah Kristen is asking what's your primary design tool XD sketch etc and they also really love your attention to detail Thanks yeah I use I used to do like 4×4 like UX stuff ICD sketch but I am a few months ago I like started using XD for the first time and I really like some of their futures but I use a lot of different things it really depends on what you're like what I'm designing like for a UX stuff I use I use XD but for like some random stuff I use sketch a lot my shrah says question for everyone how do you prefer to design and complete silence with music with career wise new season playing is there new season out yet if it is I'm super excited because I love that show what shows it queer eye that's on Netflix oh ok I don't even go on Netflix I used to do that or anything on there I love Netflix best Joss's if there's complete silence I start looking for a distraction so I need some podcasts or call music oh I I like can't listen to a podcast and design yeah the same time because it's like too much thinking like listening to podcast if I'm like cleaning or doing something or like if I was driving or I'm commuting like for me if it's like the repetitive stuff that I'm designing I listen to podcasts but if it's like creative stuff like like this yeah I can't do it either I like I like have to listen to music I cannot do it in complete silence I mean I can but it's not as fun yes oh yeah so queer is a show on Netflix thanks much but for the explanation five gay guys do makeovers for mostly straight men but it's more of a makeover yeah it's like a life makeover and it definitely does make you cry it's very emotional but it's really really good I recommend it oh um Oh is your library's yeah oh wait no not this okay it's so what are you trying to look for oh your this we had the Visa logo oh not that no just on here Joe says my brain can't stand silence I need to multitask so I usually have something in the background that's basically white noise that's a lot for the balance of this oh my god it is no one wants that much day okay yeah I think maybe we'll make this another like that like the thing the picnic what is a lava lamp thing yeah car says I listen to very bad music it helps me with my productivity Oh Pierrot says why use the old logo of MasterCard is that the only odd oh yes our Muse right and you want to just a two circles I think yeah that's just – oh yeah orange circle overlapping you can even like make it on your own and next to you I could I mean I'm not I'm just like doing just a main one for display purposes I don't think I have enough time to like even design the other car how much time we have left like five minutes four minutes four minutes yeah I think I'm gonna just like polish up everything else I still don't like this maybe I'll change that for like the final final like few minutes I like everything else though yeah it looks really cool I'm excited to see like the final product on your begins yeah me too oh um do you have any tips for people on how to like present their be Hansard Axia yeah so I would say like figure out who you want as clients and then create a company profile like of like okay so this is the companies are like the companies that when I tracked and then like for me it's like tech startups I would say like this is how much funny they would have this is like their team saw because like if it's like a large for example if it's like a large team like sixty or a hundred people then they already have like an in-house team and so just like all those different variables you would like write it write it down like in a spreadsheet or something and then you would put yourself into the shoes of like a decision maker like at the CEO or like the CMO or something and then from that perspective reverse engineer like from that perspective like figure out what what would they like so a lot of like apps a lot of like tech companies they want to look like that the biggest you know companies so that's kind of like the underlying reason like when they look at presentations even if you're like a UX designer because like when you first look at a project you see the visual design even if you're trying to display your like UX skills yeah making the visual design like spending more time on that even if that's not the skill that you sell is actually I think really worth it because that's what they first see so then if like your visual design looks a lot like like the top it kind of has the like style you know that they're going for then they're actually going to be like um then they're gonna actually spend time looking at the work where it's like otherwise even if you have a really like if you're selling UX even if you have like a really good if you're really really skillful at UX and you really present that well if it doesn't if the presentation doesn't look good and they might not even like look at it so it's really like important to focus like a lot of time on the presentation yeah thanks for those tips yeah sure Tim just shared links thanks for also sharing my links to him but everyone please go follow our Shah and where can they find you on like social media or your portfolio yeah my portfolios just type in our sheykh eonni you'll find it my Instagram is guide smell like I told intelligence are like a year or two maybe even two years that I've been out there trying to get back to it actually but they can update it on your B hands once you have it like ready to go yeah I think it's like or showed on Instagram and Instagram so that's why you're going but I think it's like Arshad probably see one 36 36 nothing it's like a thing from Ricky Morty which I like a lot so yeah so I think it's that but I might be wrong it may be like Arshad 76 some number on our own well I think you should update update on your big hands when you're ready yeah it all might be handsome let's go my Behance yes I'm ready I'll just put it on my hands nice okay awesome well thank you so much our show for joining us is off yeah it was really awesome to see your design process and your app turned out really amazing I can't wait to see you on begins oh and big thank you to everyone in the chat for joining us and hanging out and giving us feedback and asking some questions you guys were amazing as always thank you all so much and thank you guys and we'll see you next time see you guys bye


2 Replies to “Collaborative UX Design Workflows with Arsha Kiani – 2 of 2”

  1. pooyan parsa says:


  2. Azor' Lie says:

    Finished off strong. Thanks for the tips Arsha.

Leave a Comment

Your email address will not be published. Required fields are marked *