UX & UI
Design
/
/
Teaser
Showreel
Showreel
UX Design Showreel Teaser. Full version coming soon (maybe).
Music: Thismanslife — "Give Me
Contrast"
Clients / Agencies / Audiences
Analytics Data Visualisation / Concept / 2011
Online Trading Community / Concept / 2011
Compliance Data Explorer / Tablet App / 2011
About
Sequenced visuals of a data visualisation explorer, illustrating interations, transitions and overall experience flow across key states of the interface.
Morgan Stanley Matrix / Trading Platform / 2008–2010
About
Matrix is Morgan Stanley’s Fixed Income trading platform, providing their clients with access to live streaming prices, research, trade ideas and commentaries, analytics tools and the ability to trade directly from their desktops - all in a single, integrated application.
Working on-site at their offices in Canary Wharf, London, I was part of the original team who defined the UX and personally created the visual design of the UI.
During my 2+ years on the project, I co-led the UX team and worked hands-on as an interface designer. I defined and owned the visual design, interaction patterns, and the overall experience of the application. It was a privilage to work with a fantastic, talented team, and am proud to have been part of building a multiple award winning application, one of the largest Adobe Flex projects ever undertaken.
IXDA Interaction Awards 2012
Disrupting - Shortlist
User Experience Awards 2011
Silver
Adobe Max Awards 2009
Finalist
Adobe eBanking / Concept / 2007
About
Prototype designed in 2007 at Adobe to showcase a conceptual reimagining of online banking. The interface design set out to go beyond day-to-day servicing to meet more aspirational user needs – understanding spending over time, the distribution of spend, and the impact of financial choices on achieving future savings goals. It also included an innovative model for smart saving based on monthly patterns of income and outgoings, an approach that has since become a popular feature of many financial and banking apps.
Working collaboratively with an Information Architect, I defined the user interface design of the application, including the visual style, the layout and interaction of each screen, and the choreography between states. The interactive prototype was built by the genius Jérôme Cordiez, and this video was produced and published by Adobe evangelist Michaël Chaize.
For lack of a better title
Illustration
All iPhone + Instagram
Photography
Pre-storm post-calm
Glen Coe stream
Love this guy
Profiled
Midday haze
Glen Coe
Monday haar
Approach the coast
Light lines
The Quiraing
Morning dipper
Sundog
Vultures
Silhouwalker
Streaky beach
Calm sea this evening
Cloudburst
Glen Coe treetops
Still still
Waverley to Haymarket
Ready to charge
Celestial
Reekie night
No sound no waves
Sun down sit down
The classic Edinburgh shot
Tides out
Crag walkers
Night night
Yet another groyne
Sitting on the seat
Cockenzie stacks
The North
Crag tracks
Pointer
Spring haze
One of Macleod's tables
Beach furniture
The Law
Bump bump
Death from above
Busy on the beach
Hallight
All about the Bass
Queensferry light
Bench ghost
Final flight
Groyne guards
Day 1
Cairngorm funicular
Vine line
Rock station
On the edge
Dense branches
Lovely couple relaxing on the beach
Groyne point
Heavy seas
One fine day
Stag don't
Tall stories of long tails
Eerie morning #haar
Mysteries of the sea
♥
Newtown lights
Mars rocks
Amber Embra
Cross
Not much to sea #haar
Looking toward Tantallon
Into the void
Mothers & Fathers & Mothers
Quail Q
Secret Cove
Shooting the sky
The Circus is in Newtown
Planet Quiraing
Morning dog breath
Quiraing wind
Fariyland
Frosty Prom
Follow me on Instagram
A bit on the side
Projects
www.thismanslife.co.uk has been online since the turn of the century. Scroll back in time, revisiting the history of its evolution, and reminisce about how web design (and monitors) evolved over the last 20+ years.
So you need a video to fit in your responsive layout but don't know how to get it scaling in proportion? This simple tool calculates an intrinsic ratio and generates code to make your videos scale responsively with simple CSS.
A simple interactive experiment with responsive design techniques. Each device illustration is rendered using the same basic HTML which adapts its appearance to the changing viewport size.
A simple interactive experiment with responsive design techniques and a call for new tooling.
Phiculator was a dashboard widget for Mac OSX, which given any number, calculated the corresponding number according to the golden ratio. Apple removed the dashboard feature from the Mac operating system in 2019, and as as such, Phiculator is only available for older systems.
Tinkering in code
Experiments
Follow me on CodepenWho is this man?
About
James Mellers, possibly the most handsome man on the planet
Product Design leader based in Edinburgh, with expertise spanning the spectrum of design, and a background working on projects across Europe and the USA for
Adobe and Microsoft.
Balancing hands-on craft and design
leadership to deliver delightful user experiences. Want to know more? Get in touch.
Balancing hands-on craft and design leadership to deliver delightful user experiences. Want to know more? Get in touch.
From overall experience architecture to interaction details, I use design to frame problems, explore solutions and translate ideas from concept into reality. Defining problems through research and discovery, applying divergent thinking, envisioning ideas, testing, iterating and refining, and ultimately applying the hands-on craft of design production and delivery.
Working across desktop, mobile, web and beyond, with primary background experience in visual design, interface design, interaction design, prototyping, and design systems. I also enjoy tinkering in code, tweaking nuances of animation and obsessing over details.
During my 5 years at Microsoft I was part of Studio 415 working on redacted before moving to the Office team to design a modernised and simplified UI for Office Online.
Who is this man?
An Englishman in Scotland, living beside the seaside with my family and our awesome dog. I like music, films and taking photos, mostly of the beach, my dog, or my dog on the beach.
Why thismanslife?
I've used thismanslife as a URL and online pseudonym since the turn of the century, when I held this corner of the web for personal
publishing, micro-blogging back before the days of Twitter 𝕏 and such. Over time it evolved into a place to publish personal work; design, illustration and
photography.
Today, this site acts as both a portfolio and a digital dumping ground for things I make, photos I take and CSS rules I break.
You should follow me.
Press & recognition
Microsoft gives Office a refreshed look
“Collapsing the traditional three-row view into a single line that highlights the most important features.”
Microsoft Outlook users get their own built-in meeting scheduler
“...designed to give Outlook users an easier way to schedule meetings... one of the more practical applications to be released from Microsoft Garage.”
Hey Dummy: This Is What “Responsive Design” Means
“James Mellers has you covered, with a clever interactive demo called Responsive Design, Responsively Illustrated.”
Morgan Stanley Matrix
Disrupting
“Nearly everything about it, functionally and aesthetically, is radically new and innovative when compared to industry standard tools.”
United States Patent
Recall Service for Productivity Applications
“A plurality of digital artifacts may be identified based on operational context.”
I like getting emails
