A Portfolio and blog for Mustafa Kurtuldu

Web Design

Horizon Design System
Horizon Design System

Twitter's Horizon Design System

Designing at scale

Twitter’s design system, Horizon, was relaunched to focus on universally accessible UI, user-driven content and dynamic visuals.

As Product Design lead for Horizon, I led on cross-platform consistency, defining success, lobbying leadership, designing processes and mentoring our Senior & Staff Designers. My research showed that Horizon saved ~70% of a designer’s time, most using the library daily.

Drafts
Drafts

Twitter's Drafts

Making drafting accessible and syncable

The existing drafting system within Twitter needed to be fixed, as it was undiscoverable and didn’t sync between devices.

I led a redesign and research across multiple engineering teams, running multiple designs that explored ~20 designs. I conducted numerous usability studies with users to determine the best approach to launching our proposed vision on our platforms.

Dash Menu
Dash Menu

Twitter's Navigational System

Realigning core navigation to make actions intentional

Twitter’s navigational system was inflexible, and if we were to launch, all of our proposed features would have reduced the space for actual content.

As Design Lead, I was responsible for launching a new scalable navigational system, the Dash Menu, across all our platforms that enabled feature experimentation without disrupting the existing menu or content.

PWA install ui
PWA install ui

Web Apps & Google Chrome

Enhancing web app experiences

Progressive Web Apps are super-powered websites that users can install on a phone or computer. I led an initiative with the Chrome engineering team to improve discoverability, education and usage.

My work led to a greater than 100% increase in PWA installation and engagement. You can read more on the Chrome Blog.

Phone-as-a-Security-Key
Phone-as-a-Security-Key

Secure Sign-in & Google Chrome

Ending users need for passwords on the web

Two-Factor authentication, Phone as a Security Key & WebOTP empowers users by allowing them to sign in with their phones securely. Millions of users sign in with their phones as an authentication method every day; sadly, many logins fail.

I was the UX lead on our Web Platform, and my team redesigned several sign-in flows and increased successful logins by a third.

Google.dev learning website
Google.dev learning website

Google.dev

Redesigning developer learning for Google

As UX lead Google Developers documentation sites, my team aimed to redesign learning for our developer audience.

Google.dev launched at Google I/O 2019 to an audience of ~7,000 attendees. It achieved over 3,000 active users by the end of our first week with 48k pageviews.

Squoosh.app
Squoosh.app

Squoosh.app

Image compression web app

A new web tool, Squoosh, downsizes, compresses, and reformats images.

I was the UX lead and designed the app’s user journey, flow and visuals. Launched at Chrome Dev Summit 2018, the app received over ~400k visitors, which resulted in over ~230k compressed images in its first week. See app here.

MDL
MDL

Material Design Lite (MDL)

Google's design system on the web

Material Design Lite was Google’s Core Material Design Web implementation framework that allowed designers and developers to add a Material look and feel to their sites.

As UX lead, I designed templates and visual assets. My advocacy work saw increased MDL’s usage to over three millon URLs. See more here.

Chrome Custom Tab
Chrome Custom Tab

Chrome Custom Tab download UI

Bring delight to Android experiences

Native Android apps use Chrome Custom Tabs to link to web content. Usually, this means opening a webpage in a ‘Chromeless’ tab. However, when users clicked on a file, a blank page appeared.

I led a redesign of the download flow, working with our illustrators & animators to create a delightful experience for Android users.

Future of Web Design 2014

I'll be speaking next year!!!

It has been an amazing couple of months. Firstly getting my work published in .netmagazine, then seeing it put posted on creativebloq and finally getting invited to speak at Future of Web Design next year.

The talk I’ll be giving is titled “We are Digital Architects: Evolving our design language for the web” and will involve some of my ideas about the creative process and how we can embrace it as a journey of discovery, changing our thought …

Net magazine article

How a rant became a published article

I was having a bit of a rant with two of my colleagues Sven and Ben at Digital Science about design debates and trends. That prompted me to write a 500 word email about flat design and other trends to .net magazine, a few hours later I received a positive reply telling me that it was a good idea and should submit it as an article, which I did and now its in their October Issue or read the article directly on Creative Bloq.

You can’t imagine how …

The design disease

Flaws in Flat designs and other trends

Updates

This article was featured in .net magazine

There is an epidemic in the design industry. The sickness takes many forms and can affect any one of its citizens at any time. The symptoms, if not caught early, can lead to catastrophic consequences. The disease is known by many names but the one I shall call it is “ego”. It can attack anywhere, anytime and usually starts when someone triggers a debate by voicing his or her opinion. A bit like …

Responsive design

Once upon a time web design / interface design was simply the act of taking a portrait designed brochure and turning it on its side to create a landscape layout with buttons stuck on to make it cool and new media.

There wasn’t a convention of what constituted good or bad web layout, semantic mark up or even screen width. Everything seemed to change depending on who was designing / coding the said site.

Not even the web browsers could agree on how …

Recently read a thought provoking article called “The effects of themed Lipsum on design” by Andrew Fox where he wrote that Loren Ipsum had a negative impact on design and we as designers should demand most of the content upfront.

“How can you design a message without knowing what the message is?” - Andrew Fox

Now, although I agree with him in principle, this can cause a lot of issues in practice. Putting your foot down might work if …

Now and then, I meet up with old school buddies, and as the night progresses, we always have one of those conversations about what we didn’t learn at Uni. Sadly, what we were taught goes out the window soon as we enter the industry.

I started to wonder that if I knew then what I know now would I be a better designer? Or would it have prevented me from developing as a creative person? We need to learn in a ‘blue sky’ thinking …

Myths of web design

.net magazine just published this excellent article on some of the myths of web design (7 links in the navigation, 3-second rule) which, to be honest, I’m surprised that some of these still exist.

The problem is that when you start making rules, you limit yourself. We are ‘limited’ as it is to the technology of the time, so why put more limitations on yourself. Indeed we as web designers/developers should treat each website we …

Web design and stuff

Updated

Mostly grammar fixes :)

Just read this thoughtful insight into web design which I have to say I agree with. Its to do with web design books and why we don’t feel as inspired to do a bit of web design after reading them (unlike other creative fields, photography etc.). The problem with putting websites in a book is that they are interactive things and can only be fully appreciated in their own environment.

Other fields of design aren’t …

WhatTheFont

Every couples of months I get an email with a jpeg attached asking me if I know what font is being used in the attachment. What I would then proceed to do is go through my entire font collection to see if I can find it or at the very least a close match. This process could take about an hour or so……ripping out more hair then I can afford to lose…

Not anymore 🙂

WhatTheFont is a handy utility that lets you to upload a jpeg where it scans the image …

XML & Flash

The Republic of Code posted this tutorial / article on XML and Flash which i found useful so i decided to post it up. It also saves me from having to search through google again 🙂 

XML & Flash