SlideShare a Scribd company logo
1 of 6
Download to read offline
JASON JOHNUI DESIGN PORTFOLIO 2015
Status. Available for ContractWork.
DESIGN APPROACH
The design of this app, which seeks to
connect locals with people travelling to their
city and vice versa was from the start focused
on simplicity. The design seeks to entice
users to participate by showcasing other
users in their current vicinity. The features of
the app are kept to a minimum to encourage
instant comprehension of how the app
functions while retaining the powerful ability
to instantly connect with others, both in their
own city and abroad.
TECHNOLOGIES USED
Wireframing was done in Omnigraffle, design
in Photoshop. The app is being developed on
top of a clone of the Tinder source code to save
development time. This was a constant con-
sideration during the design of the app as we
tried to diffentiate from tinder but retain the
data model and some similar functionality.
MOODBOARD EXPLORATION
I created three moodboards to capture
three different styles that could be used
for the design of this iOS app.
CLIENT TRIBE IOS TRAVEL CONNECTION APP
DESIGN APPROACH
The client was looking for a sleek minimal
aesthetic. I incorporated the line from their
pre-existing logo and kept the design very
sparse in order to let their stunning visual
work shine through.
TECHNOLOGIES USED
Wireframing was done in Omnigraffle, design
mockups in Photoshop, site was built with
HTML/CSS. I incorporated the wordpress
back-end to allow the client easily customize
the site’s content and continue adding their
beautiful work.
CLIENT SEMPRE FILMS [website Design]
CLIENT ROCKET READS [APP BRANDING PACKAGE]
COMING SOON SITE
Design and production of a coming
soon site for an iOS app that facilitiates
early literacy in children. App was a
winner of Toronto Startup Weekend
2014 and was subsequently accept as
a client of Mars.
LOGO + BANNER ADVERTS
Design of a logo and multiple banner
advertisements as part of a branding
package for this iOS app.
DESIGN APPROACH
The client was a UK based dog training
company. They approached me with a pre-
existing logo, from which I built out this
scrolling site to showcase the services they
provide and offer testimonials and contact
information.
TECHNOLOGIES USED
Wireframing was done in Omnigraffle, and
design was mocked up in Photoshop. Site was
built through a thorough modification of an
existing wordpress scrolling template to better
suit the site’s content and the brandt needs.
CLIENT CO-EVOLVE DOG TRAINING [SCROLLER WEBSITE DESIGN]
DESIGN APPROACH
Extensive wireframing was necessary to
reason through the various features of this
messaging app. This allowed many elements
to be paired down, resulting in a much more
user friendly approach to what had originally
been envisaged. A custom character was also
designed for use in branding of the app.
TECHNOLOGIES USED
Wireframing was done in Balsamiq Mockups,
design mockups in Photoshop. The app is
currently being developed for the iOS plat-
form using the Firebase framework.
CLIENT GRUMBLR [IOS MESSAGING APP]

More Related Content

What's hot

ADS Company Profile
ADS Company ProfileADS Company Profile
ADS Company Profile
Eden Yap
 
CV_UX Graphic designer
CV_UX Graphic designerCV_UX Graphic designer
CV_UX Graphic designer
arvind dubey
 

What's hot (20)

ADS Company Profile
ADS Company ProfileADS Company Profile
ADS Company Profile
 
resume2015
resume2015resume2015
resume2015
 
Mobile app Portfolio - Daphnis Labs
Mobile app Portfolio - Daphnis LabsMobile app Portfolio - Daphnis Labs
Mobile app Portfolio - Daphnis Labs
 
KRDS Singapore - Case Study "Impression of your fragrance" for Molto Indonesi...
KRDS Singapore - Case Study "Impression of your fragrance" for Molto Indonesi...KRDS Singapore - Case Study "Impression of your fragrance" for Molto Indonesi...
KRDS Singapore - Case Study "Impression of your fragrance" for Molto Indonesi...
 
CV_UX Graphic designer
CV_UX Graphic designerCV_UX Graphic designer
CV_UX Graphic designer
 
Daphnis Labs Logo Design Portfolio
Daphnis Labs Logo Design PortfolioDaphnis Labs Logo Design Portfolio
Daphnis Labs Logo Design Portfolio
 
Building a viral mobile application for your startup
Building a viral mobile application for your startupBuilding a viral mobile application for your startup
Building a viral mobile application for your startup
 
The future of mobile at The Studios, Kortrijk
The future of mobile at The Studios, KortrijkThe future of mobile at The Studios, Kortrijk
The future of mobile at The Studios, Kortrijk
 
Mobile app development company in indore.pdf
Mobile app development company in indore.pdfMobile app development company in indore.pdf
Mobile app development company in indore.pdf
 
Mobile App Screens Designing Proposal PowerPoint Presentation Slides
Mobile App Screens Designing Proposal PowerPoint Presentation SlidesMobile App Screens Designing Proposal PowerPoint Presentation Slides
Mobile App Screens Designing Proposal PowerPoint Presentation Slides
 
Appscrip
AppscripAppscrip
Appscrip
 
Daphnis Labs web Development Portfolio
Daphnis Labs web Development PortfolioDaphnis Labs web Development Portfolio
Daphnis Labs web Development Portfolio
 
Mobile app development
Mobile app developmentMobile app development
Mobile app development
 
Bridging the Gap Between APIs and Customers
Bridging the Gap Between APIs and CustomersBridging the Gap Between APIs and Customers
Bridging the Gap Between APIs and Customers
 
Designing the APIs for an internal set of services
Designing the APIs for an internal set of servicesDesigning the APIs for an internal set of services
Designing the APIs for an internal set of services
 
Phone UI Design
Phone UI DesignPhone UI Design
Phone UI Design
 
Branding Web Mobile. Iperdesign case studies
Branding Web Mobile. Iperdesign case studiesBranding Web Mobile. Iperdesign case studies
Branding Web Mobile. Iperdesign case studies
 
[Pro forma] corporate lo1-lo2
[Pro forma] corporate lo1-lo2[Pro forma] corporate lo1-lo2
[Pro forma] corporate lo1-lo2
 
Crackerz Company Profile
Crackerz Company ProfileCrackerz Company Profile
Crackerz Company Profile
 
Vipindas portfolio
Vipindas portfolioVipindas portfolio
Vipindas portfolio
 

Viewers also liked

БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...
БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...
БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...
OWOX
 

Viewers also liked (15)

株式会社はまぞう 中期経営計画 20160405
株式会社はまぞう  中期経営計画 20160405株式会社はまぞう  中期経営計画 20160405
株式会社はまぞう 中期経営計画 20160405
 
Fair Use in Academic and Research Libraries
Fair Use in Academic and Research LibrariesFair Use in Academic and Research Libraries
Fair Use in Academic and Research Libraries
 
E-mail маркетинг. Итак, мифы...
E-mail маркетинг. Итак, мифы...E-mail маркетинг. Итак, мифы...
E-mail маркетинг. Итак, мифы...
 
Remote sensing
 Remote sensing Remote sensing
Remote sensing
 
Wrong education
Wrong educationWrong education
Wrong education
 
Impact of social media
Impact of social mediaImpact of social media
Impact of social media
 
Princesa sofia, estrategia pedagogica
Princesa sofia, estrategia pedagogicaPrincesa sofia, estrategia pedagogica
Princesa sofia, estrategia pedagogica
 
Brand book 1A
Brand book 1ABrand book 1A
Brand book 1A
 
pg_bigmを触り始めた人に伝えたいこと
pg_bigmを触り始めた人に伝えたいことpg_bigmを触り始めた人に伝えたいこと
pg_bigmを触り始めた人に伝えたいこと
 
БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...
БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...
БИМ 2013, Сергей Рыжиков, 1С-Битрикс, Покупки с мобильных устройств: быть или...
 
Inhouse vs-off-the-shelf-may
Inhouse vs-off-the-shelf-mayInhouse vs-off-the-shelf-may
Inhouse vs-off-the-shelf-may
 
Brain Tumor – Things you should know
Brain Tumor – Things you should knowBrain Tumor – Things you should know
Brain Tumor – Things you should know
 
Logical replication with pglogical
Logical replication with pglogicalLogical replication with pglogical
Logical replication with pglogical
 
Jalal p
Jalal pJalal p
Jalal p
 
Teaching PostgreSQL to new people
Teaching PostgreSQL to new peopleTeaching PostgreSQL to new people
Teaching PostgreSQL to new people
 

Similar to Jason John UI Portfolio 2015

Rohit Profile 2017-Tresbu
Rohit Profile 2017-TresbuRohit Profile 2017-Tresbu
Rohit Profile 2017-Tresbu
Alvin Rohit
 
Pradeep_iOS_Developer
Pradeep_iOS_DeveloperPradeep_iOS_Developer
Pradeep_iOS_Developer
Pradeep kn
 
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping ProcessStanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy
 

Similar to Jason John UI Portfolio 2015 (20)

Zainab Kashim Portfolio 2019
Zainab Kashim Portfolio 2019Zainab Kashim Portfolio 2019
Zainab Kashim Portfolio 2019
 
Mobile App Development Proposal Template PowerPoint Presentation Slides
Mobile App Development Proposal Template PowerPoint Presentation SlidesMobile App Development Proposal Template PowerPoint Presentation Slides
Mobile App Development Proposal Template PowerPoint Presentation Slides
 
Angela Frucci Portfolio
Angela Frucci PortfolioAngela Frucci Portfolio
Angela Frucci Portfolio
 
Angela Frucci Portfolio
Angela Frucci PortfolioAngela Frucci Portfolio
Angela Frucci Portfolio
 
Kuldeep_IOS
Kuldeep_IOSKuldeep_IOS
Kuldeep_IOS
 
Rohit Profile 2017-Tresbu
Rohit Profile 2017-TresbuRohit Profile 2017-Tresbu
Rohit Profile 2017-Tresbu
 
Bipin Pradhan UX & UI Designer
Bipin Pradhan UX & UI DesignerBipin Pradhan UX & UI Designer
Bipin Pradhan UX & UI Designer
 
UX/UI portfolio
UX/UI portfolioUX/UI portfolio
UX/UI portfolio
 
User Experience and Product Design Portfolio
User Experience and Product Design PortfolioUser Experience and Product Design Portfolio
User Experience and Product Design Portfolio
 
Pradeep_iOS_Developer
Pradeep_iOS_DeveloperPradeep_iOS_Developer
Pradeep_iOS_Developer
 
GeoFocus
GeoFocusGeoFocus
GeoFocus
 
Kotlin Script
Kotlin ScriptKotlin Script
Kotlin Script
 
Ashfaq Amin's UX Portfolio
Ashfaq Amin's UX PortfolioAshfaq Amin's UX Portfolio
Ashfaq Amin's UX Portfolio
 
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping ProcessStanfy Publications: Mobile Applications UI/UX Prototyping Process
Stanfy Publications: Mobile Applications UI/UX Prototyping Process
 
Why redesign is necessary for your app to increase its profitability
Why redesign is necessary for your app to increase its profitabilityWhy redesign is necessary for your app to increase its profitability
Why redesign is necessary for your app to increase its profitability
 
Portfolio Stephanie Höhn
Portfolio Stephanie HöhnPortfolio Stephanie Höhn
Portfolio Stephanie Höhn
 
Ninjabit ppt
Ninjabit pptNinjabit ppt
Ninjabit ppt
 
Vijayabaskar-Resume
Vijayabaskar-ResumeVijayabaskar-Resume
Vijayabaskar-Resume
 
Shantanu kulkarni-Graphic and UIUX Designer
Shantanu kulkarni-Graphic and UIUX DesignerShantanu kulkarni-Graphic and UIUX Designer
Shantanu kulkarni-Graphic and UIUX Designer
 
Portfolio of Wenzhu Zou
Portfolio of Wenzhu ZouPortfolio of Wenzhu Zou
Portfolio of Wenzhu Zou
 

Jason John UI Portfolio 2015

  • 1. JASON JOHNUI DESIGN PORTFOLIO 2015 Status. Available for ContractWork.
  • 2. DESIGN APPROACH The design of this app, which seeks to connect locals with people travelling to their city and vice versa was from the start focused on simplicity. The design seeks to entice users to participate by showcasing other users in their current vicinity. The features of the app are kept to a minimum to encourage instant comprehension of how the app functions while retaining the powerful ability to instantly connect with others, both in their own city and abroad. TECHNOLOGIES USED Wireframing was done in Omnigraffle, design in Photoshop. The app is being developed on top of a clone of the Tinder source code to save development time. This was a constant con- sideration during the design of the app as we tried to diffentiate from tinder but retain the data model and some similar functionality. MOODBOARD EXPLORATION I created three moodboards to capture three different styles that could be used for the design of this iOS app. CLIENT TRIBE IOS TRAVEL CONNECTION APP
  • 3. DESIGN APPROACH The client was looking for a sleek minimal aesthetic. I incorporated the line from their pre-existing logo and kept the design very sparse in order to let their stunning visual work shine through. TECHNOLOGIES USED Wireframing was done in Omnigraffle, design mockups in Photoshop, site was built with HTML/CSS. I incorporated the wordpress back-end to allow the client easily customize the site’s content and continue adding their beautiful work. CLIENT SEMPRE FILMS [website Design]
  • 4. CLIENT ROCKET READS [APP BRANDING PACKAGE] COMING SOON SITE Design and production of a coming soon site for an iOS app that facilitiates early literacy in children. App was a winner of Toronto Startup Weekend 2014 and was subsequently accept as a client of Mars. LOGO + BANNER ADVERTS Design of a logo and multiple banner advertisements as part of a branding package for this iOS app.
  • 5. DESIGN APPROACH The client was a UK based dog training company. They approached me with a pre- existing logo, from which I built out this scrolling site to showcase the services they provide and offer testimonials and contact information. TECHNOLOGIES USED Wireframing was done in Omnigraffle, and design was mocked up in Photoshop. Site was built through a thorough modification of an existing wordpress scrolling template to better suit the site’s content and the brandt needs. CLIENT CO-EVOLVE DOG TRAINING [SCROLLER WEBSITE DESIGN]
  • 6. DESIGN APPROACH Extensive wireframing was necessary to reason through the various features of this messaging app. This allowed many elements to be paired down, resulting in a much more user friendly approach to what had originally been envisaged. A custom character was also designed for use in branding of the app. TECHNOLOGIES USED Wireframing was done in Balsamiq Mockups, design mockups in Photoshop. The app is currently being developed for the iOS plat- form using the Firebase framework. CLIENT GRUMBLR [IOS MESSAGING APP]