Here I am, just finished watching Apple's keynote at WWDC 2018 Conference. It was fun to see what Apple has been working for the past year, some really cool updates coming to the iPhone and iPad, Mac, Apple Watch, and Apple TV. We have decided to share our highlights on Apple's Developer Conference, so you simply won't have to watch the keynote again hah! In all seriousness, I love the part where Apple spoke about privacy, about them working tirelessly to create a seamless experience. This is music to my ears and it will be interesting to give it a whirl. Now let's break it down! Announcing upgraded operating systems for iPhone and iPad, Mac, Apple Watch, and Apple TV. We’ve packed them with new features and experiences, so with a simple update this fall all your devices will feel more powerful, personal, and fun than ever. More Links Learn more about the WWDC 2018 Announcement WWDC 2018 iOS New Features This is where I have been putting more of my attention and at the same time noticing so many cool updates. To be honest, I have a feeling that Apple has been learning a lot from its competitor (Android) even though they mentioned that iOS has the fastest software OS adoption than Android. From introducing a new file for AR called the USDZ, I particularly loved the app called: Measure where you would use to phone to measure things in real-time through AR. Apple introduced another new app called: Shortcuts where you will be able to direct a series of actions through this app, all triggered by setting your own keywords with Siri. It's pretty impressive, imagine with just a few words, Siri can set up your home thermostat, your home commute and even play your favorite playlist. It's super intuitive, might be interested to give it a try myself. Just like Google, Apple has acknowledged the fact that we spend a lot of time on our phones and it's becoming quite distracting throughout our daily life. They have improved the Do Not Disturb Mode for your bedtime and also you can set up your DND Mode by setting it up with a timer or whenever you are leaving your actual location. For the same occasion, Apple is finally releasing the Group Notifications, with a swipe you can now triage a whole bunch of notifications away. New iOS 12 Introducing Memojis The cool stuff hah! We have to see this type of Emojis before with Samsung but no one does it like Apple. With iOS12, you can now customize your own Emojis, now called: Memojis. It's fun but again how long you wanna spend time on your phone Memojis Group FaceTime That's a cool feature coming to iOS12 where you will be able to use Group FaceTime up to 32 people simultaneously. That would be video conference a lot funnier, not sure about productive though! One thing though, the UI for this new feature has been giving a lot of think about their approach. It's a nice touch to see the person's window getting larger as they talk but I think we would have thought about something a little bit more visual. WWDC 2018 WatchOS New Features Not a lot of people were too crazy about the latest updates on WatchOS, I personally liked the new app entitled: Walkie Talkie where you simply communicate to another Apple Watch user by simply pressing the Talk button. Great onboarding for adding a new contact/friend. WWDC 2018 MacOS New Features WWDC 2018 Dark Mode! Some little thing are coming to MacOS but the most noticeable change would be the introduction of Dark Mode. You gotta admit that it makes everything look even more gorgeous. This might be my most exciting feature to come on the next MacOS. WWDC 2018 Most of the updates were mostly software NOT hardware. It's mostly to be expected when you are attending the WWDC which are for developers. I loved those little updates, nothing too crazy but enough for us designers to start to think about different things related to our workflow. Hope you have enjoyed this coverage. More Links Learn more about the WWDC 2018 Announcement
Our friends from Unsplash are making some noise with the launch of Unsplash for iOS. The idea is quite simple, bringing awesome images into your iOS applications faster and quite easily. Starting the launch on the iPad and iPhone (Hopefully Android will come soon!), the app is quite playful and quite enjoyable. I love the fact that they enhanced the experience on the iPad, you should definitely give it a try. Unsplash for iOS For nearly five years, 78,222 contributors have been building the largest library of freely usable, high-resolution photos anyone can use for anything. On Unsplash.com, over 481,304 photos have been shared and downloaded over 362 million times. More Links Learn more about Unsplash Get the app Unsplash for iOS In their words Today, we’re bringing all the freely usable photography on Unsplash to iPad and iPhone. And we’re doing it in a way that focuses not only on photography but on the creative use of it. The Unsplash app is super focused on doing just one thing well: getting great images into creative applications quickly and easily. Unsplash photography is meant to be created with. Yet, most acts of creation still happen on “computers.” The next step after you download an Unsplash photo is likely opening a creative tool like Photoshop or Keynote on a desktop or laptop computer. Photo Gallery Check it out in action
It is here! The most anticipated iOS that we've been waiting for a long time now. Is it worth the upgrade? Yes, definitely is. Overall, it's more or less the same but it's definitely an enhanced experience from its predecessor. I would say that is 2x the radical enhancement you will experience on the iPad, that's a nice move from Apple. For the review, we decided to change the formula of instead highlighting its new features. We'll be more focusing on useful features that you can use as a designer for your workflow. Let's dive into iOS 11! iOS 11 sets a new standard for what is already the world’s most advanced mobile operating system. It makes iPhone better than before. It makes iPad more capable than ever. And now it opens up both to amazing possibilities for augmented reality in games and apps. With iOS 11, iPhone and iPad are the most powerful, personal and intelligent devices they’ve ever been. iOS 11 Control Center Control Center Control Center gets the most attention from this update, just because it is totally different. I would say the UX approach is pretty close to what's been done on Android. Everything is easy to access, works like a toggle mostly and you can customize it. I heard that when you are turning off "Wifi" or "Bluetooth" for example, it doesn't entirely turn them off. That's for debate. One thing though, when clicking on the "Wifi" icon, the transition will work like a long press. I wish that very same transition could have worked for when you wanna go straight to your "Wifi" settings instead of going through the "Settings Icon". Overall for the day-to-day activity, the Control Center gives you what you actually want of your iPhone. Your browser does not support the video tag. Screen Recording If you stay aside from recording creepy videos off Snapchat. It's actually a really neat feature for us designers. I would see this feature working well for instructional videos or tech support. As you can see, it's pretty simple, you tap the "Record" button off the Control Center (with or without audio) and that's it! I would definitely see myself using "Screen Recording" to explain a user flow or transitions for example. That's pretty neat! SOS This might be off-topic but I think it's a nice feature that can actually save lives. Imagine yourself in a very unfortunate situation, you press quickly five times on the power button, you can "Auto Call" which will dial 911. To setup: Settings -> General -> Accessibility -> Call Audio Routing -> Auto-Answer Calls Your browser does not support the video tag. Editing Screenshots Another great feature to enhance your workflow, I've found myself in many situations where you would take screenshots and upload it through Instagram Stories to be able to use their editing tools. Well not anymore with IOS 11. I also love the fact that you don't have to go back to your "Camera Roll" and edit. Drag and Drop Feature Drag and Drop I gave it a try on the iPhone and sometimes it worked and vice-versa. It was definitely worth it on the iPad. The feature "Multi App Dragging" where you tap and hold an app until it wiggles so you can select multiple apps and then drag them all to a new screen or folder. It truly makes the iPad into a solid device more beyond than before. iOS 11 Gallery If you still haven't downloaded or upgraded your device yet, check out Apple's iOS 11 site. And give it a whirl yourself! More Links Follow my tweets @aoirostudio Follow my pictures on Instagram Images via Apple
Museums always provide us the chance to go back in time, learn about our past, our history. The diversity of things that museums offer to help us understand their exhibits, audio video tours and in this day in age, mobile apps is pretty incredible however there is room for opportunity. I am amazed that museums haven't really stepped up and created incredible experiences. Imagining VR for museums of the world, Marcin Nogal and Amplituda took a pass on redesigning the British Museum app for iOS. The result is quite elegant and definitely deserving of a feature here on Abduzeedo. One of the things I really liked about this project was the typography and beautiful imagery. The dark background works quite well, it makes the images pop. The view pager with the horizontal scroll and some of the transitions reminds me of some of the Material Design guidelines, which is not a bad thing. The British Museum, founded in 1753, is the first national public museum in the world. From day one entry was free and given to ‘all studious and curious Persons.' Free museum meant free access to knowledge, it opened a possibility for anyone to learn and innovate. We’ve challenged ourselves to reimagine the digital museum experience. To deepen the connections between museum and its visitors we designed a mobile experience around three main objectives: learn, discover and experience. For more information check out the Behance page Lead Designer: Marcin Nogal UI animation: Karol Nadolny Architecture photography: Aleksandra Kicka Intelectual Property belong to their rightful owners - British Museum This work is intended for personal use.
I know you might say that flat design is the new trend and that skeumorphism is past, however the talent behind the work is never over. It is important to understand the context to judge the design. For this post I would like to feature these two amazing icons created by CreativeDash Design Studio based in San Francisco, California. The details and craft behind the work is just mind blowing. Digital studio focused on enhancing your customers’ experience via incredibly attractive vivid graphics and engaging interface design. Final Donut
It's been some time since our last UI Design post, but I was saving some great looking applications for you guys! There are some crazy good looking apps with fantastic design being made right now. One of these apps is the Swing, a free music app for the iPhone. The designer responsible for this is Enes Danış, from Turkey. He's got an awesome portfolio which you should check! I hope you enjoy these, and if you got your own UI Designs, drop a comment! Cheers. ;)
This week we selected apps for sport, connect people, travel and discovery! With Avocado you can connect only with one person, the most important in your life. You'll see here Strava, a new option for track your running. For those from Netherlands, you should check 9292. Also take a look on the new StumbleUpon Android app! Check that out and stay tuned for the next week!You can keep sending me your suggestions via Twitter twitter.com/FabianoMeand include #abdz_apps in the message.Avocado - avocado.ioAvocado™ is the best way to stay connected with the most important person in your life. We understand the need for a fun, fast, reliable and private way to stay connected to your partner when you’re out and about. DOOO - figtreelabs.netWorld's Smartest Reminder & To-do Note. Not too SIMPLE, Not too COMPLEX. It's Easy and Clear. StumbleUpon! - stumbleupon.comWe'll help you discover great sites, videos and photos from around the Web. Just tell us what you're interested in, and start Stumbling. Strava - strava.comTrack your running and compete against friends Record all your runs, analyze your performance and see how you stack up against friends and locals. Set new personal records and beat your friends’ times! 9292 - 9292.nlWith the new app the 9292 travel planner has become even more mobile!
I have received quite a few emails asking me how to create that sort of linen texture effect we see in the iOS on iPads and iPhones. I like that effect but had never stopped to think about how I could do that in Photoshop, so last week I decided to give it a try. For my surprise it was much easier than I thought. So in this tutorial I will show you how to create the linen texture effect in Photoshop and also the metal/glass effect we see in the Apple logo in the iOS. Step 1 Open Photoshop and create a new document. I'm using 2560x1440 pixels for the size. After that fill the background layer with black. Step 2 Add a new layer and go fill it with white using the Paint Bucket Tool (G). After that make sure you have black and white for the background and foreground color, then go to Filter>Noise>Add Noise. Use 100% for the Amount, Gaussian for the Distribution and select Monochromatic. Duplicate this layer once. Step 3 Select one of the layers with the noise filter and then go to Filter>Blur>Motion Blur. Use 90º for the Angle and 50 pixels for the Distance. Step 4 Select the other layer with noise and go again to Filter>Blur>Motion Blur. Use 90º for the Angle and 50 pixels for the Distance. Step 5 You will have to layers with the blurry effect, one will be with a vertical texture and another with horizontal. Select the one that is on the top and change the Blend Mode to Multiply. Group the 2 layers into a folder and then change the opacity to 40%. Because we applied the motion blur, the edges get a bit transparent so select both layers and go to Edit>Transform>Scale. Increase a little bit the size of the layers so you can hide those edges. Step 6 Now import a symbol to use in your wallpaper. I'm using the Abduzeedo symbol. Place it in the middle of the document. Step 7 Go to Layer>Layer Styles>Gradient Overlay. Click on the gradient colors to open the Gradient Editor. Then use a color scheme like the image below. Step 8 Now back to the Gradient Overlay options, change the Style to Radial and increase the size to 150%. Then click on the symbol hold the button of the mouse and move it to move the gradient position. Use the image below for reference. Step 9 Select Bevel and Emboss. Use Inner Bevel for the Style, 150% for the Depth, Down for the Direction, 1 pixel for the Size and 2 pixels for the Soften. For the Shading use 103º for the Angle, 40º for the Altitude. For the Highlight Mode use Screen with white at 100% Opacity, then for the Shadow Mode use Multiply with black at 30%. Step 10 Select Inner Shadow. Use Screen for the Blend Mode with white for the color, -90º for the Angle, 5 pixels for the Distance, 25% for the Choke and 5 pixels for the Size. Step 11 Now select Drop Shadow. Use Multiply for the Blend Mode with black for the color. For the Angle use 90º with 5 pixels for the Distance, 0 % for the Spread and 15 pixels for the Size. Step 12 This is the effect you will have after these 12 steps. Step 13 Add a new layer on top of the symbol. Select the symbol area by clicking with the right button of the mouse over the thumbnail of the layer, then select the option Select Pixels. After that go to Layer>Layer Mask>Reveal Selection. Then with the Brush Tool (B) with a very soft brush and white for the color, paint in the center of the symbol. Also change the Opacity to 40%. The idea of this step is to create a reflection in the metal effect. Step 14 Now add a text, in my case I added the Abduzeedo logotype. Then go to Layer>Layer Styles. Use grey for the color with Multiply. Step 15 Then select Inner Shadow. Use Multiply for the Blend Mode with black for the color. For the Angle use 120º, 2 pixels for the Distance, 0% for the Choke and 2 pixels for the Size. Layers Order Conclusion Here is the final outcome of the tutorial. The idea of this tutorial was show you how to create the line texture but I decided to add the logo with an Apple style effect in it. The whole process is very straightforward and if you want to use different colors for the linen texture you will have to change the background color or the opacity of the 2 layers with noise/motion blur, the ones we created in the steps 2 to Darker Version Download the Photoshop File Click here to downlaod the Photoshop file used for this tutorial