Designing for iOS 7: Working With and Breaking Conventions | Sarah Mick | Skillshare

Designing for iOS 7: Working With and Breaking Conventions

Sarah Mick, Designer, Illustrator & Photographer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
6 Lessons (35m)
    • 1. Trailer

      1:41
    • 2. Welcome & Intro to iOS 7

      5:41
    • 3. Researching, Reading User Reviews and Note Taking

      6:34
    • 4. Taking Notes to Sketching

      6:17
    • 5. Wireframing

      8:22
    • 6. Designing in Photoshop

      6:32

About This Class

Designing for iOS7 is a whole new ballgame. The basic app design rules have changed as well as the entire iPhone operating system. It’s important to know the basics in terms of Apple native apps as well as current design expectations from the user.

Once you know these basics, you can begin to break the rules and create beautiful, unique designs. In this class, we’ll look at existing apps, specifically the transition of Tinder for iOS 6 to iOS 7, and walk through how improvements can be made when redesigning as well as reworking the user experience based on user feedback.

What You'll Learn

  • Research. Be an avid user before you can considering what improvements.

  • Identifying Improvements. Critique the design and the experience, identifying where improvements can be made. I’ll share user feedback and improvement examples from my experience at Tinder during this phase.

  • Sketching. Take your ideas and improvement lists to paper with rough sketching.

  • Wireframing. Finalize the sketches and clean them up in the wireframing phase.

  • Design Mockups. Start thinking about how the design will look and finalize the entire screen. It should be “developer ready.” I’ll show examples of Tinder mockups that were thrown out and iterated on during the iOS 7 redesign.

What You'll Make

You’ll select an app that you use frequently but feel could use a an update based on iOS 7 design and usability standards. You’ll pick one or two screens and redesign the screens making design and usability improvements. Your project will include initial thoughts that lead you to redesigning the screens, sketches of the UI and how you’d like to improve it. Finally, you’ll create development-ready design mockups of your screeen(s) as well as an explanation of every improvement you’ve made and how it helps the user both visually and functionally.

Transcripts

2. Welcome & Intro to iOS 7: - everyone. - Welcome to Unit One. - This is the introduction of the transition from Iowa six to Iowa, - seven up on the screen. - Right now. - You can see that on the left there is the home screen for the Iowa seven and on the right - there is the home screen for Iowa. - Six. - When I think about the transition from Iowa six to Iowa seven the, - um, - sort of de emphasis on the heaviness of the interface reveals the simplification of the - user experience and up on the screen. - Right now you can see that there's aux versus you eye chart and you can check this out in - the downloads and a couple of links about you x versus you. - I just for clarification for anyone who's not familiar with it. - And I'm going to be going through a couple of APS and their transitions that you guys are - probably familiar with. - This 1st 1 is Vine and I was six is on the left and IOS seven is on the right, - and the next one is Airbnb IOS six on the left, - IOS seven on the right. - One thing you'll notice throughout all of these is that IOS seven is going to be a lot - flatter, - which is something you'll hear talked about a lot in Iowa. - Seven. - Is things made flat? - Um, - What you can see again with Instagram here IOS six on the left and then also on the right - and then the newest version in the center, - which is Iowa seven and super simplification here for Instagram, - the next one is going to be four square, - which went from a fairly heavy kind of gray with lots of buttons and then to a super - simplified on the right and then again with Instagram. - This is a good example of the sort of you x kind of you I being changed with input fields. - And then we hear some thoughts by the Iowa seven. - Designer Gianni Ifit works for Apple um, - about designing. - And one interesting thing that I found as I was gathering information for this course is - just kind of to drive home the emphasis on the fact that the design for the iPhone hasn't - changed a lot since its original conception. - And on the left there you see the original iPhone and on the right, - you can see that that's IOS six, - right before the change. - And then what you're going to see on this next screen is the change in icons. - And so these air, - the native icons on the left are the Iowa six icons. - And then on the right are the Iowa seven icons and you'll notice again, - simplification, - a sort of flattening there, - some Grady INTs kept, - but overall, - it's just sort of simplifying and then taking away that kind of real life feel. - If you look at the newsstand, - you'll see that it's no longer a bookshelf, - but just sort of mentioning the books that would be on the shelf. - Um and then hear those icons are in context of the screens that they would be placed on, - and you'll notice that overall, - it's just a bit less busy. - It's a bit less textural than it's a bit less depth there, - and this kind of plays into the quotes that you just read that people understand that what - they're pressing his buttons. - They understand what they're getting into our setting screens. - They don't need those references to real world items so much, - and that's can be seen here and the calculator as well. - They understand that that five is a button. - It doesn't need to look so much the glossy button anymore. - And so, - keeping all of these things in mind, - um, - we're going to be working about talking on the class project. - And so the class project is going to be a redesign. - So we're going to be picking, - um, - app. - Everyone who's going to pick a different app to redesign for the class. - You're going to redesign one or two screens, - so you should pick an app that you care about. - Ah, - it should either be a nap you care about from a visual or functional standpoint. - It doesn't matter if it's already been redesigned. - You can always do a better redesign if it hasn't been redesigned. - Even great, - you'll get more bang for your buck. - Visually, - um, - you should become an expert on the APP. - That means used the APP. - You either should already use the app. - Or if you don't use the app and you want to become an even more of an expert villages, - download it and start using it like crazy. - Um, - you should also be aware of competitors and copycats, - and by that I just mean you should make sure that you understand that if it's a photo app, - then download other photo APS. - So if you're gonna redo, - let's say you're in a radio instagram. - Make sure that you understand how lots and lots of photo taking app works. - APS work. - You should be looking at how the native iPhone APP works. - You should be figuring out how you know, - how does the flow of taking a photo work on just about every app that takes a photo? - And so it's not just about kind of looking at a Napa visually and redesigning it from a - visual standpoint. - It's about redesigning it from a functional standpoint and understanding how its - competitors are functioning and things like that. - So it kind of be thinking about that stuff as well. - Is just using it yourself and getting really familiar with the ins and outs. - You should be able to kind of walk through all of the screens of the up in your mind all of - the basic screens and, - um, - that's really about it. - And also you can find all of the basic information in this slide, - Um, - share just armed the skill share website, - and that's about it. - So thanks everybody, - and I will see you in the next unit, - but I 3. Researching, Reading User Reviews and Note Taking: - everybody. - Welcome back to Unit two and this unit is covering research and you x and you eye and - you'll see in this little chart I talk a little bit about you, - x and you, - I and how IOS seven allows for the user to experience the design a little bit more simply - without all of the bells and whistles of Iowa. - Six. - And check out the downloads in the links section in skill share, - firm or explanation of this. - And here's an example in Iowa, - seven vs Iowa six. - And how the recording section has been really, - really simplified. - So there's a less emphasis on real world items to convey Usability on Iowa. - Six. - On the left, - you can see that it was a microphone where somebody used to record, - Um, - and it's totally flat now, - so there's less shadowing and heaviness in depth, - and this goes for all of Iowa. - Seven. - It's cleaner, - clearer, - and there's a general lack of realism and extreme kind of scheme ORF, - ism and visual design. - And here's an example of an app that I really, - really like that I think is doing a great successful job in General of Iowa. - Seven. - Design and I think that this app does a great job because it kind of balances the sort of - depth that you would want and out to have. - While it kind of conveys where someone can tap where you're able to use the app at the same - time is maintaining those flat aesthetics that are so, - um kind of predominant throughout the Iowa seven style. - And here you'll see that there's nice, - um, - background images that are blurred in the background. - And I just think this is a great example of that kind of balance. - And here I am, - showing you guys what we talked about and what we did when we identified usability issues - for tender. - And this is some things that you're going to want to consider yourselves when you're - picking out the app that you want to redesign for this course, - so everyone should read user reviews. - You should review the designs based on new design usability developments. - Um, - you should want to chat with your friends with people using the app with your team and with - also, - of course, - your client. - If you are working with the client and then you should also want to, - of course, - improve the visual design. - And so when we were looking at tinder specifically, - we kind of went through and we found some things that were a little bit strange that we - wanted to work with, - like icons, - numbers that were disjointed and style differently, - even though they were all supporting that mean image. - And the main photo, - then after the initial launch, - was able to be improved to a larger size. - And since that larger size was improved than those margins that you can see circled there, - our, - um, - we're kind of improved. - So it wasn't such a strange sizing. - And then, - of course, - the Iowa six styled elements, - like those kind of deep inset buttons, - were re skinned. - Teoh, - stick to the new Iowa seven design expectations. - And so we were able to take away some of the greedy int in the heavy button treatment and, - um, - the knave bar at the top. - And then you can see them side by side there, - and you're you're able to see the difference. - And what you get on the right, - I think, - is a lot kind of cleaner and more usable. - And it's a lot better use of space, - which which is, - I think, - the most successful thing about the tender redesign and one of the things I was most proud - of you're really able to understand the product a lot better, - which was, - I think, - a great success. - And so, - as we're kind of continuing along what you want to do when you're researching, - I think the most important thing for me was user reviews. - So you should always read user reviews, - all of them all of the time. - And you can set up email to get an email every time a user reviews the product. - And don't be afraid of negative reviews. - Negative reviews are your friends. - They will help you keep a critical eye, - which is my next point. - Be tough on yourself and keep that critical eye. - You consort your reviews by most critical and read them. - There's nothing wrong with that. - And then the last point. - Don't let a successful app go to your head and design is never really finished. - And so by that I just mean, - you know, - you could be really successful and people could be telling you that they think your design - is really great. - But you know you can always be improving yourself. - And, - um, - there's always people who are outrageously more talented than you are. - And you should always be trying Teoh improve yourself and reading negative reviews is going - to remind you that you probably aren't where you want to be and that there are people who - aren't understanding what you thought that they might be understanding. - And, - um, - aren't having the experience that you wanted them to have are intended for them. - Toe have. - And so it's important to keep in mind that you know you're there for the user and you want - them to have the best experience possible and not to get that big head. - Um and so here, - you can see, - um, - that what we're going to be working on is, - um, - this section is taking notes and so applying everything from this little this little - lecture and taking notes. - So printing out a copy of the screens that you want to redesign from the app you've picked - and you want to take the notes based on the reviews that you have read and you also want to - take notes based on your own thoughts and what eyes not working things that you don't like - if it's an app that hasn't been transition toe Iowa seven yet, - Obviously, - you're going to have a lot of visual changes, - and then you can just circle those draw in things that you want to change, - like scratch them out, - cross them out. - Um, - just draw all over this. - This is one thing that we did at tinder a lot was just to print out screens and kind of re - draw in what we wanted to change. - And, - um, - it was sort of freeing to just kind of like drawl overs off, - which I think is a good first step before even kind of like wire framing or sketching is to - draw on top of what already exists. - And then once you have selected what you want to keep and what needs to change, - then just finalize a copy of your notes and keep those. - And so this is just going to be basically a roadmap for our next step, - which is going to be getting into sketching before wire framing. - And so you just want to make sure that your notes are clear enough so that when we get into - sketching, - you know what you want to do and so check skill share and make sure that you guys are up to - date on everything that you need to do for tonight's homework. - And, - um, - there are some more links and things like that up there, - and I will see you guys next lecture. - Okay, - but by 4. Taking Notes to Sketching: - Hey there. - Welcome back to Unit three. - We're going to be talking to about sketching, - so picking up where we left off, - you should pull out your notes and scribbles from the last unit, - and they should be mostly finalized in kind of ready to break down into a list. - And this list is going to be separated into two categories so you can do this on your own. - This is things that you're going to change or remove, - and things that you want to keep in the app that you're redesigning because they're working - well. - And one thing that's important is to keep the things that are working well. - You don't want to lose those during this process, - and we're going to be taking those and moving into sketching and why it's needed. - And so, - first of all, - um, - why sketching is needed, - it's fast. - You can get out your ideas really quickly, - Um, - and using those kind of fast gestural on refined shapes spur creativity. - You could do it anywhere. - You don't need a power outlet, - and this is the most important, - and this kind of harkens back to the quote at the top of the screen. - Your first ideas are almost never your best ideas. - And so the more you sketch and the more ideas you have, - the better your chances that you'll have a really great idea. - Or that you'll come up with something kind of unique that no one else has ever thought of - before. - And so just make sure that you are sketching and you're sketching a lot, - and that's really important. - Um, - and if you have some reservations about sketching, - here are some examples of my sketches. - These are all from tender from our redesign process over there this past summer of 2013 and - in the fall, - and you can see on the upper right. - I have, - like, - super archaic, - kind of just like circles and squares, - because those things at the time were more helpful than like a block of text. - Could be, - um, - all the way down to the left. - I was working like camera views, - and I have really kind of chicken scratch sketches and, - um, - you know, - it still gets the job done so it doesn't matter if you're sketching is really beautiful. - Um, - although I do have some examples here of that, - I pulled off dribble of people who do really beautiful sketches. - Which, - of course, - if you do this kind of sketching, - that's fabulous. - So don't hold yourself back if you want to do these kind of like high Fidelity sketches, - because this is really great and sort of resolved in complete, - Um, - And then here are some examples of just different styles. - And so I guess my point here is just that you shouldn't be afraid to sketch if you are not - the best. - I guess, - hand artist. - And then you should also, - uh, - you know, - not hold yourself back if you want to go for it and do these kind of results sketches. - And while you're getting into sketching, - we should be thinking about the conceptual thoughts about the Iowa seven redesign. - And so these are all from Apple's Human interface guidelines Update for Iowa seven, - which you can download on the Skill Share website. - I've linked this in this section, - and it's important that you guys read it now. - So, - um, - first be thinking about stripping away the you I to expose the apse core functionality, - and this is something that I talked about at the beginning of this lecture series and how - IOS seven really allows you to kind of get down to the core functionality because there - isn't so much embellishment. - Next use the themes of Iowa. - Seven. - Teoh, - inform the design of you I and these air experience And, - ah, - you should restore these embellishments and these details with care and don't do it - gratuitously So I guess in the past there was a lot of embellishment. - There was a lot of heavy design ingredient, - and you should be careful when using this stuff on Do it do so thoughtfully, - Um, - and then throughout, - be prepared to defy precedent, - question assumptions and let it focus on content and functionality. - Motivate every decision. - And so these are just some of things that I found particularly interesting from the human - interface guidelines or the hig. - So just make sure that you go and read that it's pretty lengthy, - Um, - but it's really important at this step where you're starting to sketch and you're drawing - those you elements. - Ah, - it's important that you show that you understand this stuff. - Um, - yeah, - so next moving on to ah, - sketching and taking sketching from your notes so you can see on the left here I have notes - , - which is what they should look like from last section. - And this is from when I was working at yard sale. - I just took a photo from my notebook like user testing notes. - Kind of me like drawing in on, - um, - a print out of of, - ah, - mock up. - And then, - um then on the right, - this is what everything should look like after this section. - So you've taken your notes and you have turned them into sketches and refine those notes - down into a couple key points for each screen. - And so at the end of this section, - once you've taken your notes and you have synthesized them, - you should upload your final cleaned up sketches for everyone to see. - You should include a few side notes beside each sketch. - And so these are just the most important things you can see at the top. - For my first sketching, - who did like that has a red header in like a cream background that was particularly - pertinent for that, - um, - that sketch, - because that wasn't something that was in the original design. - Andi, - make sure to include the original design, - which you can see on the upper left there. - This is just so we have something to reference. - We know how drastic the changes are that you're suggesting making, - and then this is something already mentioned. - But make sure to read the Apple Human interface guidelines, - so it's absolutely necessary. - The step part of this course is doing quite a bit of reading on your own because there is - only so much time I could walk you, - you know, - kind of holding your hand through the Apple guidelines. - But you'll get through it a lot quicker if you just sort of read it and understand it and - then start applying it in your sketches. - And, - um, - as we move into the wire framing step and then the high fidelity design mock ups in the - last step, - it's really gonna show if you understand the stuff. - So make sure you read it at this point and, - um, - posts this stuff online. - And I'm really excited to see what everyone is sketching, - and I can't wait to see everyone's design skills. - And so, - um, - that's pretty much it for this unit. - If you guys have any questions, - make sure to post them online, - and I will be on their answering them. - And, - um, - I also posted some links for you guys to check out. - So make sure to read those as well, - and I'll see you in the next unit. 5. Wireframing: - Welcome back. - This is unit for and we're talking about wire framing. - And this first screen is an example of really great wire frame image from dribble that I - pulled. - And this is just one of my favorites. - So, - um, - the first question is why we're framing Why should you do this? - And for the longest of times, - I really disliked wire framing. - I didn't do it. - The first answer is it's really brings a lot of clarity and organization to your project, - and it brings interaction to the forefront. - And this is really important not to get kind of hung up in design and to focus on that - interaction to focus on how people move through the flow of the design. - And then finally, - when you're actually working on the design, - it's sort of freeing because you've already gotten a lot of that interaction out of the way - , - and you can focus on the way things look and they're not doing it all at once. - I usually in the past kind of tended elect to jump into everything all at once. - And, - um, - if you could force yourself to do this wire framing process, - it will help. - Are all of that being said, - though, - you should use common sense, - so you don't really need to usually wire from every single page. - And here's a good example of that. - So, - um, - this is the profile screen for Instagram, - and then this next view is the followers of you. - And so I would I would would wire frame the one on the left and I wouldn't wire from the - one on the right just because it's a fairly simple view and I know what a list for you - looks like. - I probably already know what my buttons they're going to look like for a project. - And I've already done the tab. - Art the bottom. - So if you water for him to money pages, - the wire frame is going to become a project in and of itself. - Um, - and don't use too much detail. - So by that, - don't get hung up on the way things look, - don't start thinking about the design too much, - and no need to select color at this point. - And by color, - I don't mean sort of blue and dark blue at the top. - I mean, - like a sort of myriad of colors. - If you want to select shades. - Go ahead to suggest, - um, - it up and then start rough and jittery. - Make a lot of different versions of things and you'll see that here you're watching over - the next several minutes is going to be a fast forward of me working on the sketches from - the last unit. - And these are my three final sketches that I did for the tinder redesign. - And, - um, - I am working on a super rough kind of wire frame, - and this is the way I like to work with wire framing. - I don't use grids when I water frame for a couple of reasons. - First of all, - I find that if I use a grid, - I get pretty hung up on making sure the proportions air correct right off the bat. - And then I usually take it into Photoshopped anyway, - So I'm going to be changing things and moving things around. - Um, - and usually things go through Ah, - kind of final refinement process anyway, - So I like to keep things fairly loose with my wire frames. - And so by that I just mean that I use icons that probably won't be the final icon. - There's sort of placeholders, - and I use text, - usually just like Helvetica, - um, - and different weights and either shades of gray or shades of blue. - And I go in and pretty much in terms of keeping things aligned. - I just use the illustrator alignment tools quite a bit just to make sure that everything - like looks correct. - And it is somewhat grouped, - and it's pretty like shipshape. - But in terms of things being perfect And, - um, - you know, - kind of like the proportions of the exact iPhone grid. - I don't worry about that stuff. - Another reason is I know the proportions fairly well by now in my head. - So, - like, - I can kind of guess it them in a kind of passable way during the wire forming process. - And so I just go ahead and do that. - And then when I get into photo shop and start working on the design, - the first thing I do is start putting everything down to a grid and then I start designing - it. - And so, - um, - as you watch this, - um, - just know kind of all of that stuff that I just mentioned, - and I'm going through and making sure that I mark in everything in a really clean way but - I'm trying not to get too hung up with any of the specifics. - And if you have any questions about this process, - go ahead and post them in the discussion section and I'll make sure that I get back to - everybody. - Um, - also, - if you are interested in doing things a little bit more specific, - I know some people love doing grids at this point and doing things more kind of like - cleanly marked up. - I am posting some great um uh, - locations on skill share where you can download really beautiful illustrator, - um, - like assets basically. - And for like, - think 40 bucks you can download warm that has tons and tons of two screens. - And they're really, - really great screens. - And it will end up making your wire frames look a bit more like the wire frame screen that - I posted at the beginning of this unit. - Um, - and if you sort of like to do things a little bit more loosely and keep things a bit more - free than feel free to try this process, - which is just basically working with shapes and I comes here, - you can see that I'm finishing up my first iteration. - Then One of the nice things about working an illustrator at this point is you can just copy - and, - um, - duplicate so and just drag down the initial one and then start Iterating from there. - And so that's what I'm doing. - I just had a couple changes to make on that second version and then on my third version, - Um, - I'm just copying the 1st 1 because it looked a bit more similar. - Teoh the 3rd 1 And so as I'm working, - I'm just making, - like, - kind of my new changes at this point. - And I think that's one of my favorite things about working in, - like digital. - At this point, - you don't have to keep a redrawing everything, - which is really, - really nice and sort of freeing. - And I think that's why people have a tendency to want to skip to digital, - just kind of from the get go. - But I think you wouldn't really be as quick and doing this stuff if you hadn't started from - the sketching stage. - And here you can see I'm just kind of like trying to have this depth right. - I played around with these colors forever. - I think at the beginning of my lecture I mentioned, - like don't play around with colors too much. - This is a good example of what not to do. - So I'm just trying to show there's some good depth here with a card stack. - Um, - and I couldn't get it to show it in like the right there, - like a depth of color without making it look funky or green. - So I just played around with that for a while, - and you can see how quickly I've been able to generate on just three examples. - And these were just the three that I decided to show for the course, - both in sketch and in wire frame. - But it's a really good example of how you can really knock out three versions super fast - and that you should generate as much as possible and do as many as possible and definitely - do more than three if you can. - What you can see here is the beginning of my wire framing process, - and this is just to show you that you should keep our finding. - So on the left you can see the tender or started out really rough, - with some screens that we didn't even end up using with features that don't even exist and - then on the right is closer to what the actual product ended up looking like. - And so, - with all of that being said, - just get ready to post. - So while you're working on this just keeper finding and then when you're done, - post several final wife wire frames include typed subsidiary notes for each design. - This is just the main points that you want to drive home from your sketching phase that - probably have changed a little bit all the way through the wire front framing phase. - And just type those up and put them next to each of your, - um, - wire framed images and then also include a screenshot of the app you're redesigning as well - as your final sketches. - So it should kind of look a little bit like a timeline. - And so show the screenshot of the app next to the sketches next to the wire frame and what - we want it to look like when you are all finished is things haven't gone from notes. - Two sketches tow wire frame to ah, - full design, - and it'll be a really nice time line process for you to look back on and that's about it - for this section Again. - If you have any questions, - make sure to post them in the skill share project section or discussion board, - and I will happen there and reply to everybody and enjoy the section and I will see you in - the next unit. - But by 6. Designing in Photoshop: - Hey there. - Welcome to Unit Five, - the final Unit. - So we're talking first of all about grids. - And so this is getting you started with designing in Photoshop. - So grids air kind of funky thing to teach because everyone does this differently or they - don't do it all on the left is how I do things I do. - A 22 pixel rhythm grids, - 22 pixels, - repeating with a center column and some right and left margins. - Some people do nothing. - That's the center there. - They just eyeball it, - which I don't really recommend but, - you know, - teach their own. - And then on the right, - you can use columns and gutters, - but check out skill share. - I put a couple links to some PSD files that you can download, - um, - to do this on your own and figure out which one you feel comfortable with, - cause basically, - that's the most important thing. - And if you're feeling like you need to just look at some more Iowa seven designed to get - more of a feel for it. - After reading the hig than check out this website, - it's linked again for you. - It's great, - has a bunch of well known APS now off to the tinder redesign. - I'm just gonna show you a bunch of screens from stuff that was trashed to what we ended up - with. - This is the 1st 1 So this one is the screen that we started working on when we were first - told there was gonna be a redesign. - And this is what I worked on with Chris Kuczynski, - who was by design partner and the thoughts here. - We're like, - we can put a blur in the background and we can make the shared friend shared interests and - a number of photos on the same line. - And let's try and add words in the nab our instead of icons. - We were really just like super early in the Iowa seven process, - and this obviously got thrown out. - And then this was once we were a bit more familiar with IOS seven, - obviously having our call up color like our company's signature tender orangish red as the - Knave and Status bar, - which is Apple's suggested design choice and then a darker 10 for the background to make - the picture pop more and then taking away the kind of gaudy red X and green heart. - Um, - in the bottom design. - Ultimately, - this one, - we didn't feel like we had the nail on the head. - So we moved on and kind of combined a lot of the flatness from the previous one with the - 1st 1 I showed you, - this idea here was to basically make the background mirror the foreground and show you that - every time you swipe the card, - the background would change along with the foreground. - And it was to explain that Tyner was about the people who were on the app. - This one was a big favorite, - and actually the entire app got redesigned. - It was even programmed. - So we love this, - and everyone else loved this and we played with it and it got all the way through - development almost to release. - But then eventually, - no one ended up singing it, - except for $10 tender and apple, - because we felt like it was a bit too heavy. - So we pulled it back and we said, - Ah, - what is tender doing now and what's working? - And the answer was that a lot of things visually were working, - even though most of them kind of happened by accident originally. - Um, - and it happened before I started working there. - So, - um ultimately we said, - Let's keep the feel that you get when you open the app But let's make it look better. - And so that's what we didn't and you'll see the final redesign is on the right, - and most of this is in the app. - Still, - I think that they've updated a couple icons and stuff, - but most of this is still there and exactly how it looks now. - And, - um, - the vibe here is just Teoh organize things, - keep things cleaner, - make the functionality better and not distract from the person that you want to look at, - which is the main function of the app in the person of the card that your own. - And I think that that's pretty much what we accomplished here. - So I was pretty happy with the final result of the one of my favorites was always that - blurred image one. - Um, - you confined in the Donald suction for skill. - Share this file. - If you have ever done mobile design, - you're probably familiar. - We're familiar with it. - It's just the native assets as put together by T hand lacks. - So check this out. - I've got this for you as well as, - um hopping to photo shop and go under view and go under show. - And make sure that, - like you're smart guides, - air turned on that. - You're showing your grid. - You're showing your guides and you're snapping the grid or snapping two guides. - Your smart guides your like. - You can play around with the settings. - Some people, - actually, - Haytham I find them really helpful. - I use usually designed with this stuff all on. - So, - um, - make sure that if you have never used it, - though, - or you aren't even aware that it's there that, - like you play around with this, - though, - and basically what it means if you don't know, - it's just that as you near things that air close to whatever you're snapping do it's gonna - like highlight that grid line and then snapped the object over to it so that you're aware - that you're close to something that is gritted correctly, - and then you can place the object on it. - I think it's really helpful, - and that brings us basically to the final project. - And so the final post of this entire class project is going Teoh be posting all the work - that you've done so either add on to your original post or post everything that you've done - from the beginning. - Whichever you've been doing so far, - Um, - and basically present the evolution of the class project nicely and just however you would - for your portfolio. - So I think I think I say in the the class project thing to do it in an iPhone. - Obviously wrap your screen designs in an iPhone. - But if you want to go above and beyond, - feel free to and include a screenshot, - of course, - again of the things that you're redesigning. - And then I think, - most importantly, - make sure that you review other projects. - And this kind of goes the same for If you're feeling like you need some inspiration, - don't just feel like you have to look at inspiration of existing APS like hop into the - discussion section and look at other people's projects. - And that can also give you some good inspiration. - Even looking at other people's sketches can inspire you, - um, - and give you some great ideas. - In the last class that I taught on scale share, - everybody was super inspired by each other's projects, - and that was really fun to see everyone going in and leaving reviews and then kind of - altering their projects after looking at other people's projects. - So that could be really helpful. - So if you have any questions at all, - let me know. - I'll be happy to answer them or chat with you guys. - I'm gonna be in there replying to everybody and commenting on projects and thank you so - much for taking this course. - I really hope you enjoyed it and learn something and are inspired to keep working on Iowa - seven.