1
JOJO MARIA GEORGE
Jojo Maria George | Design Portfolio
Design Portfolio
Hi, I am Jojo Maria George I did my graduation in Mechanical Engineering who should follow the mathematical relationship between force and materials. Working as a HVAC designer for 2 years in a company, I recognized my talent, my passion is not into the machine nut into the magic of visuals. Quitting the job and tried to be a freelance graphic designer, taught me chasing the passion is not that easy. So I decided to learn visual communication- which is my dream, my passion.
Field of Interest UX/UI Grahics Design Publication Design Branding Typography
Schooling 2013 Masters M.Des DoD, IIT Guwahati 2006 Bachelor B.Tech- Mechanical Govt. Engg. College Kozhikode
Swadesh: Game Design
1
Swadesh is a board game designed for learning the history of Indian freedom struggle for school students. Providing an interactive way for learning difficult topics will help the students in their studies and will create more interest to the subject.
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
Swadesh: Board Game
User Research and Findings
01 02 03 04 05
Literature study (History of freedom struggle Existing board game) Case Study and user survey. Developing process. Concept Developing
2
User research Outcome Who already played a board game ?
Who are still playing or interested in board games?
What kind of board game they like?
Developing Process
Final Design
Yes 96% No 4%
Who plays video games?
Yes 83% No 17%
Luck & Strategic 96% Strategic 4% Luck 4%
Who are playing video games regularly ?
Meant to be played in the class room during the period or leisure time. Creates interest in students towards history. Students above 4 standard can understand and able to play Maximum number of players will be 4. Even 2 people can also play. Jojo Maria George | Design Portfolio
Yes 83% No 17%
Yes 74% No 26% Swadesh: Board Game
Swadesh: Board Game
1
Game about Freedom Struggle of India Swadesh is a board game designed as a part of thesis project for the school children to make them familiar with the history of Indian freedom struggle. The gaming experience of freedom struggle will make them familiar with the incidence and personalities involved in the particular event. The main elements of the game are the board, the cards, dice and the tokens. The game can be played with minimum 2 and maximum 4 players. Since the duration of the game is fixed from 30min. to 1hr, it is suitable to play during the lecture period.
Jojo Maria George | Design Portfolio
Swadesh: Board Game
Swadesh: Elements
2 1915
1900 1901
1925 1916
1930 1926
1942 1931
1947 1943
1947
1857
1900
1943
1857
4
5 6
1915 1916
12 11 10 9
8
1942
3
1931
2
Rule Cards
7
1930
1901
1
The Board
1926 1925
1926 1930
1916
1925
13 14 15 16 17 18 24 23 22 21 20 19
1915
1931
25 26 27 28 29 30
1901
1943
1900
1942
36 35 34 33 32 31
1857
1947 1857
1901 1900
1916 1915
Jojo Maria George | Design Portfolio
1926 1925
1931 1930
1943 1942
1947
Swadesh: Board Game
Swadesh: Cards
3
These cards will help the players to score points as well as give them the brief information about major incidents and personalities involved in the freedom struggle.
Event Cards These cards are designed on the basis of the majour incidents happened during the freedom struggle. This will help the players to score points.
Jojo Maria George | Design Portfolio
Personality Cards These cards are designed on the basis of the important personalities involved in the freedom struggle. This will help the players to multiply their points.
Chance Cards These cards are ment for creating interest in the players by pucting the luck factor in the game
Swadesh: Board Game
Hippie Convoy: Branding
4
Hippie convoy is a company that deals with colorful apparels. Inspired from the hippie culture that existed in the United States in 1960’s. They believed that, “you are cool as long as you are colorful and comfortable in your apparel”, and stood for freedom, spirituality, change, cultural diversity and of course celebration
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
Hippie Convoy: Branding
Hippie Convoy: Brand Identity
5
The van designed and manufactured by Volkswagen became the identity of peace convoy led by hippies. The cartoonist representation of the van will directly communicate the message of hippie as well as peace convoy.
Jojo Maria George | Design Portfolio
Hippie Convoy: Branding
Hippie Convoy: Logo Details Colour
Grey Scale
6 C07 M35 Y97 K00 C01 M20 Y73 K00
C78 M11 Y36 K00 C64 M00 Y25 K00
C01 M99 Y00 K00 C06 M82 Y00 K00
C75 M68 Y67 K90 C00 M12 Y29 K00
C00 M00 Y00 K19
C00 M00 Y00 K53
C00 M00 Y00 K66
C75 M68 Y67 K90 C00 M00 Y00 K10
C00 M00 Y00 K31
C00 M00 Y00 K42
C00 M00 Y00 K47
Monochrome C75 M68 Y67 K90
HIPPIE
Galapogos BRK FISHfingers
Jojo Maria George | Design Portfolio
Hippie Convoy: Branding
Hippie Convoy: Packaging
7
15 cm
specially weaved ultra fine fabric friction free skin friendly yarn mercerized combed cotton twin processed for durable comfort preshrunk to retain shape
support@hippieconvoy.com
S
M
L
XL
PLANT A TREE INDIA Friends with Nature
100% cotton Boxer Shorts
10 cm
Jojo Maria George | Design Portfolio
Hippie Convoy: Branding
Hippie Convoy: Packaging
ched night?
8
i wont drink anymore...!!
my caravan
bonkers!! it’s monday again
i just don’t care
It’s fridaayyaa
children
w’re s
i just don’t care
It’s fridaayyaa oops!! i did it again
california surf club
how i reached home last night?
woodstock
festival
i wont drink anymore...!!
flower i just don’t care i just don’t care
w’re s
children
rave
k ic
my caravan
bonkers!! it’s monday again i di
Expressions Jojo Maria George | Design Portfolio
Beatles
Life of a hippie Hippie Convoy: Branding
Magic Foods: Branding
9
‘Magic foods’ is a particular brand of food based on the traditional Malabar delicacy. There is also a chain of cafeterias to sell this taste varies from traditional snacks to beverages
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
Magic Foods: Branding
Magic Foods: Logo
10
The basic form of the logo is inspired from a half eaten bread. The typeface and other graphical elements are chosen to reflect the traditional feeling and cultural richness of Malabar. The basic colour of the logo is orange which reflects spiciness and the delicacy of the culture.
C00 M55 Y100 K00
C00 M00 Y00 K100
C00 M00 Y00 K00
C00 M00 Y00 K00
Typeface: Museo Slab 500
Colour of the Logo Malabar is well known for its delicious sea foods - especially malabar fish curry. The colour formate of the logo is inspired from this delicious dish
Jojo Maria George | Design Portfolio
culture Tas t e t he best!! Tas t e t he Brand Caption Typeface: Kristen ITC Regular
Magic Foods: Branding
Magic Foods: Stationeries
11
T Shirt & Cap Visiting Card
Serving Plate & Cup
Jojo Maria George | Design Portfolio
Magic Foods: Branding
Magic Foods: Banners
12
Panel 1 : Size : 10’ x 20’
Panel 2 : Size : 4’ x 20’ culture Tas t e t he best!! Tas e t e th
Panel 3 : Size : 2’ x 20’ culture Tas t e t he best!! Tas e h te t
Panel 4 : Size : 4’ x 10’
There is no sincerer love than the love of food Bernard Shaw
‘
‘ culture Tas t e t he best!! Tas t e t he
Arrangement of panels in the food counter Jojo Maria George | Design Portfolio
Magic Foods: Branding
Magic Foods: Banners
13
Size : 8’ x 10’
Size : 4’ x 30’
Jojo Maria George | Design Portfolio
Magic Foods: Branding
Weather App.
Designing an weather information application in ios plateform for iphone 6plus.
Jojo Maria George | Design Portfolio
Weather App.
Weather App. Literature Study i phone 6plus Basic display specification
• Retina HD display • 5.5-inch (diagonal) LED-backlit
widescreen Multi‑Touch display with IPS technology
• 1920x1080-pixel resolution at 401 ppi
• 1300:1 contrast ratio (typical) • 500 cd/m2 max brightness (typical)
• Full sRGB standard Jojo Maria George | Design Portfolio
• Dual-domain pixels for wide-angle viewing
• Fingerprint-resistant oleophobic coating on front
• Support for display of multiple
languages and characters simultaneously
• Display Zoom • Reachability
15
Reachability
Reachability brings things at the very top of the screen down closer to the bottom of the screen. If you have trouble reaching all the way to the top – for example when using the phone with one hand – Reachability can make things a lot easier to reach. To activate reachability, you touch the home button twice without pressing it down. The reachability mode will stay active until you touch something on the screen, then it will go back to normal display mode. If you want to cancel the reachability mode, you can either double-touch the home button again or just wait a few seconds and things will reset. Weather App.
Weather App. Consideration
16
Design Consideration • •
•
Sine it is difficult to reach on the top portion of the screen the main functions should located at the bottom of the screen But putting all the function on the tab bar can create clutter and other functional issues, sampling is required. Mostly used function can be placed in the bottom other functions such as reach, notification etc can be placed on the top of screen. Adding more gesture based interface will make the app easy to use.
Main Functions and usage
Jojo Maria George | Design Portfolio
• Home
Mostly in use
• Location
Use often
• Map
Use often
• Settings
Barely in use but important
• Pictures
Use often
• Search
Barely in use (mainly for adding new locations)
• Add location
Barely in use
Weather App.
Weather App. Wire Frame Location
DD/MM/YYYY 00:00 AM
17
Location
65
DD/MM/YYYY 00:00 AM H6 7 L 62
65
H 67 L 62
DD/MM/YYYY 00:00 AM
Home Screen Home screen contains a background picture of the current location according to the weather condition. There is a group of icons for pictures, locations, list of places and settings in the tab bar. Information Panel contains • Name of the current location • Date • Time • Icon represents current weather status • Current temperature • Maximum and minimum temperature Jojo Maria George | Design Portfolio
Weather forecast This feature gives the informations about the weather in the coming hours. The user has to swirl his finger in the analogue clock appears when he ouch and hold the screen. The time and date will change accordingly and will show the information corresponding to that time. The background image will also change according to the time and weather. Thus user can experience the condition visually and it will make the application little interactive.
Weather App.
Weather App. Wire Frame Location
Location
DD/MM/YYYY 00:00 AM
18
65
DD/MM/YYYY 00:00 AM
Forecasting
mph
Precipitation
40% SUN
MON
TUE
WED
THU
FRI
SUN
MON
TUE
WED
THU
FRI
SAT
H 67 L 62
H 67
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
SAT
40% 40% 40% 40% 40% 40% 40%
Postcast
Day time 62
SAT 6 AM
H 67 L 62
N
Wind
4
65
H 67 L 62
62 62
MON
TUE
62
62
62
62
WED
THU
FRI
TODAY
6:30 PM
More weather Information When the user swipe in the left direction another screen will appear with more details. This screen shows informations about wind precipitation and the duration of day.
Jojo Maria George | Design Portfolio
Forecast and Postcast Screen This screen will show the details about the weather condition in coming 7days and also included a line graph showing the average temperature of the past 7days.
Weather App.
Weather App. Wire Frame
Location
DD/MM/YYYY 00:00 AM
65
H 67 L 62
Map View The icon in the tab bar will leads the user to another screen consists of a map. He can search and explore weather information of different places. Hover tap on the map will register that particular and save the location in your location list. The user can access to these location anytime without searching.
Jojo Maria George | Design Portfolio
19
Location
H 67 L 62
Location
H 67 L 62
Location
H 67 L 62
Location
H 67 L 62
Location
H 67 L 62
Location
H 67 L 62
Location
H 67 L 62
Location
H 67 L 62
Forecast and Postcast Screen The location list will shows the information about the places already saved by the user. Taping on the screen will leads to the detailed information screen as in the current location details (ie. home, more weather information, whether forecast and postcast). To add more location, search on the search and press + button. Hover tap on a location will register the location as the current location
Weather App.
Weather App. Wire Frame
20
Location Location
DD/MM/YYYY 00:00 AM
Location
Location
DD/MM/YYYY 00:00 AM
65
DD/MM/YYYY 00:00 AM
65
H6 7 L 62
H 67 L 62
Forecasting SUN
MON
TUE
WED
THU
FRI
SAT
H 67 L 62
H 67
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
Postcast 62
SAT
62 62
MON
TUE
62
62
62
62
WED
THU
FRI
TODAY
Pictures Gestures User can access to different pictures of locations uploaded by other • Since there is no home button, double tapping on any screen will users. This will give him an understanding about real situation of leads to the home screen. the place. This feature will be mainly beneficial for travelers. By • Swirling on the home screen or the main information screen of pressing on the camera icon, user can upload pictures of his location. the other location will bring the information about the coming The drop down menu on the top will leads the user to other locations hours and days along with the visual experience happening on from his list the background picture of the location • Swipe will leads to more information about the location • Hover taping on empty space of any screen will set that particular page as home. User can easily access those information directly opening the application. Jojo Maria George | Design Portfolio
Weather App.
Weather App. UI Samples
21
New York 29/11/2014 09:00 PM
Location
New York
30
29/11/2014 09:00 PM H 67 L 62
30
DD/MM/YYYY 00:00 AM
65
H 67 L 62
H 67 L 62
Forecasting SUN
MON
TUE
WED
THU
FRI
SAT
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
H 67 L 62
Postcast 62
SAT
Photos
Maps
Locations
Settings
Photos
Maps
Locations
Settings
Photos
62 62
MON
TUE
Maps
62
62
62
62
WED
THU
Locations
FRI
TODAY
Settings
Interface Interface is very strait forward and uses only those elements and colours which essential. Since the information is not based on any colour coding, colours are chosen according to the basic principles to give emphasis and contrast and to create hierarchy. Mostly it consits of shades of gey and keep the back ground image as the key element because it is main part of the communiation. This image can be taken from the library uploaded by the users concidering quality
Jojo Maria George | Design Portfolio
Weather App.
The 1000 Floor Elevator
22
Designing an elevator system for an hypothetical 1000 floor building
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
1000 floor elevator
The largest elevator circuit: Burj Tower, Dubai
23
The elevator systems are installed by global elevator leaders, Otis. The main service elevator, positioned in the central core of Burj tower has the world’s highest elevator rise at 504 meters. Racing at 9 meter per second it also has the world’s longest traveling distance for elevator. There is no single elevator which covers the whole 160 floors, instead there are many system strategically grouped to align with the floor layout
Jojo Maria George | Design Portfolio
1000 floor elevator
Problem Analysis
24
Here the scenario is a single elevator that covers 1000 floors of a building. Assume that the elevator stops in each floor and during the transit. The users of the elevator can vary according to the service provided in the building. Since it contains 1000 floors there can be many spaces divided for different purposes. There will be hotels, cinemas, parks, shopping places etc. So the user can be random which means anyone can be the user.
Facilities that can be provided. If the elevator travels at a speed of 9 meter per second (same as Burj tower) it will take almost 8min. to cover 1000 floors without any stopping in between. So,
• There can be seats to take rest • TV screen or music player can be provided for entertainment
Jojo Maria George | Design Portfolio
1000 floor elevator
Problem while using Existing Interface
Design 1: 1000 button design
As in the normal elevator if we provide button for each 1000 floors there will be 1000 buttons for selecting the floor all over the panel.
• 2 buttons for open and close • 2 buttons for emergencies (alarm and phone) • To operate these many buttons is very difficult for the user
• It will be difficult to distinguish highlighted (selected)
25
Design 2: Numeric keypad
• While entering the number of the floor the user lacks the experience of selecting a floor
• The user can make mistakes very easily than the usual interface
• The user can relate the numeric keypad to calculator or cellphone
• Deselecting a particular number become complicated
floors in the panel
Jojo Maria George | Design Portfolio
1000 floor elevator
Concept1 : wire-frame
Floor Range Selection Menu Selection of the particular floor become easier while selecting the range. The floors are divided into ranges of 100 for easy navigation.
Floor Selection Menu
26
400 - 500 300 - 400
A scroll down menu will appear according to the range. The user can select the floor from this menu.
200 - 300
Sub Ranges of the floor
100 - 200
The user can easily navigate to the particular floor using the sub ranges menu in the right side of the floor menu.
G - 100
112 111 110 109 108 107 106 105 104 103 102 101 100
100-120
120-140
Music Player
Music Rock
Dance
Jazz
Hard Rock
Hip-Hop/Rap
Reggae
Blues
Pop
Classical
Details of floor 107 Commercial space
Since the elevator is taking a long time to reach the particular floor, a music player is provided where the user can select the genre of the music.
Information Panel 1
Commercial space
Commercial space
140-160
Commercial space Commercial space Commercial space Commercial space
160-180
Level
55
107 300
505
206
This shows the information about the particular floor which is about to reach. It can be a blue print of the floor to help the user to navigate through the floor.
Information Panel 2
Shows the current level of the elevator and the selected floors.
Buttons
Open, Close, Phone and Alarm
180-200
Essential Features
Selecting and reselecting of floors is kept in the left side of the panel since it is easy to access
Jojo Maria George | Design Portfolio
Extra Features
Emergency buttons, Information Panels and music player are given in the right side because these are used often
1000 floor elevator
Concept1 : Interface
27
Floor Information
Level 541
11
10
1
9
8
3
4 5
1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11.
6 7
2
Hotel Restaurant Movie Games Dress Super Market Office Studio Saloon Spa Cafeteria
There are two kinds of panels in the final design- Information panel and operating panel Music Player
55
Dance
Jazz
Hip-Hop/Rap
Reggae
Pop
Rock
Blues
Hard Rock
Rain Song_Led Zeppelin
Select Your Floor 900 - 1000
550
580 - 600
549 800 - 900
548 547
700 - 800 600 - 700 500 - 600 400 - 500 300 - 400 200 - 300
546
500 - 520
545 544 543 542
Information Panel
It mainly shows the information such as blue print of the floor and current level of the elevator. A small portion of this panel is converted into a touchscreen music player.
Selected Levels
541 600 752 780
Operating Panel
This panel is mainly for selecting the floor. It shows number of floor in which user can select the particular floor
560 - 580
541 540 539 538
540 - 560
537 536 535
520 - 540
534 100 - 200
533 532
G - 100
Jojo Maria George | Design Portfolio
531
500 - 520
1000 floor elevator
Concept1 : Installation
28
Installation of operating panel
To prevent the rush inside the elevator there will be operating panels out side the elevator. The user enters his floor number before entering into the elevator
Jojo Maria George | Design Portfolio
1000 floor elevator
Concept1 : Installation
29
Installation
The operating panel will be installed on the wall around chest level of the user which makes the user to operate the panel easily. Information panel will be on eye level to provide clear display. According to the capacity of the elevator there can provide more number of panel.
Instructions
Selected the range of the floor from the first list Select the particular floor To navigate easily to floor the user can use the range given in the right side of the floor menu
Jojo Maria George | Design Portfolio
1000 floor elevator
Concept1 : Scenario
30
1. USER WANT TO GO TO FLOOR NUMBER
2. HE SELECTED RANGE FROM THE FIRST
547
MENU
900 - 1000
510
800 - 900
509
700 - 800
508
600 - 700 500 - 600 400 - 500 300 - 400 200 - 300
507
580 - 600
560 - 580
540 - 560
504 503 502
100 - 200
501
G - 100
500
520 - 540
500-520
4. HE SELECTED 547
550
800 - 900
549
700 - 800
548
500 - 600 400 - 500 300 - 400 200 - 300
Jojo Maria George | Design Portfolio
510
800 - 900
509
700 - 800
508
500 - 600 400 - 500 300 - 400 200 - 300
507
580 - 600
560 - 580
506 505
540 - 560
504 503 502
100 - 200
501
G - 100
500
520 - 540
500-520
5. DONE!!!!
900 - 1000
600 - 700
900 - 1000
600 - 700
506 505
3. HE SECT SUBRANGE 540 - 560
547
580 - 600
Selected Floors 560 - 580
547
546 545
540 - 560
544 543 542
100 - 200
541
G - 100
540
520 - 540
500-520
1000 floor elevator
Concept2 : Scenario
31
Operating with voice command
The user can select the particular floor using voice command. There will be a close range microphone in the elevator system the user can come close to it and prompt the floor number. The system will detect the voice and process the command. There will be facility for correction as well as multiple entering option. User should press and hold the button to activate the microphone in order to prompt the command. So there wont be any miscommunication due to noise.
Jojo Maria George | Design Portfolio
1000 floor elevator
Concept2 : Design
32 Sensor
Senses the user while standing in front of the device and send message to the elevator system to stay with the open door
Information Panel
Shows the prompted floor number and already selected floor
Microphone
Close range microphone which capture only the voice of the user
Activate Button
Press and hold the button and prompt the name. If the displaced number is correct the user can release the button or else prompt again
Jojo Maria George | Design Portfolio
1000 floor elevator
Concept2: Installation
33
Installation
The user should come closer to the device, which can be installed outside as well as inside of he elevator. Press and hold the blue activate button then prompt the number of the floor. The number will be detected by the device and displayed on the information panel. If the number is correct the user can release the button. Then the particular number will be get added to the selected floors. If the number went wrong because of any noise user can prompt it again without deserting the button.
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
1000 floor elevator
Concept2 : Scenario
34
SELECTED FLOORS
547
547
TY FOR FIVE VEN SE
1. USER WANT TO GO TO FLOOR NUMBER 547 547
Jojo Maria George | Design Portfolio
2. HE PRESS AND HOLD THE BUTTON
3. HE GAVE VOICE COMMAND TO DEVICE
4. DONE!!!
1000 floor elevator
Combined Design
35
• Combing the two design can provide better out put. The voice command
system makes the things easier and faster. While the touch display system can give more information and precision
• The system can be installed inside as well as outside of the elevator. • Another combination can be also provide by installing the voice command system outside and the touchscreen display inside.
Jojo Maria George | Design Portfolio
1000 floor elevator
emot
36
emot. is a mobile application in which people can customize their mobile according to their emotion and share the settings with their friends. If their friends are also sharing the same sort of feeling with them they can also be a part of their emotion by customizing the personal settings of the phone
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
emot.
emot: Concept and Design
Yashodhan opens his emot. in his phone. emot. will ask him to write about his feeling
Jojo Maria George | Design Portfolio
37
He writes ‘im feelng amazng 2day’ in the provided text box in the app
He shares his words in his circle by pressing ‘sharing in circle’ button
emot.
emot: Concept and Design
emot. will ask to change his wallpaper, lock screen, colour scheme, ring-tone and even he can add a music track to his play list according to his emotion. Jojo Maria George | Design Portfolio
38
He writes ‘im feelng amazng 2day’ in the provided text box in the app
He shares his emotion in his circle and the notification will send to the people in his circle
emot.
emot: Concept and Design
emot. shows the confirmation message that he successfully shared his emotion with in his circle
Jojo Maria George | Design Portfolio
39
Wanrisa got the notification from Yashodan telling that he is feeling amazing. emot. asks Wanrisa that whether she is also feeling the same or not. She press yes since she want share the amazing experience with Yashodhan
emot. will show what all changes it is going to make in her phone according to Yashodhan’s preference. She accept to change the settings with Yashodhan. If she press no, emot will ask for her feeling and the cycle continues. emot.
Funshop
40
Experience online shopping and by sharing with your friends
Jojo Jojo Maria Maria George George | Design | Design Portfolio Portfolio
Funshop
Funshop
41
Online Shopping Experience
Getting a friend’s advice on a new piece of clothing, or even a new car, is all part of the shopping experience. But this is harder to do when shopping online or through a mobile. Yes, you can send a link via e-mail, but it’s not quite the same.
Problem Analysis
• Investigate the possibility to create a unique social shopping environment for shoppers. • Design an application that merges shopping functionalities of online marketplace with the social networking capability of social network community.
Social Commerce
Social commerce is a subset of electronic commerce that involves using social media, online media that supports social interaction, and user contributions to assist in the online buying and selling of products and services.
Social Shopping
Social shopping is a method of e-commerce where shoppers’ friends become involved in the shopping experience. Social shopping attempts to use technology to mimic the social interactions found in physical malls and stores.
Jojo Maria George | Design Portfolio
Funshop
Funshop: Case Study
42
Here I took case study- mainly concentrated of features- of two popular websites in social networking and e-commerce, facebook and flipkart
Flipkart
Share ideas with friends
Purchase products
Discuss about topics
Get discount
Comment or like friend’s opinion
Choose items according to the comments and ratings
Meet new people and interact
Know about new products through recommendation
Explore new topics through your friends
Creating a new experience Here I try to blend the features of these two website to create new shopping experience Jojo Maria George | Design Portfolio
Funshop
Funshop: Work Flow
43
Friends Activity Recommended
Home
News Feeds
Shop Friends
Profiles
Your Profile Log in
Notification
Friends Message
Customer Care Track Order Cart
Recent Orders Older Orders
Electronics Men Women Baby & Kids Books & Media Home & Kitchen More Stores Offers Order Refund Problem with the item received Change Order Place order Pin Check Continue Shopping
Details of Activity
Comment Appreciate Send to friend’s News Feed
Products
Details Activities
Details Activities
Combo Related Summery Details
Buy Ask Opinion Suggest
To Everyone Selected Friends
Send notification to friends
Friends List
Details of Activity Tell Opinion Suggestion Comments Appreciation
Main Features
• Users will able to see the shopping related activity done by their friends • User can suggest or ask opinion to their friends about a particular product • Comment or appreciate friend’s activity • Explore new products through the recommended items Jojo Maria George | Design Portfolio
Funshop
Funshop: Interface Design
44
• The interface is designed for 10” display tablets • The screen resolution is 1920x1200 pixels • As the navigation panel is hidden it wont disturb the browsing experience • Search bar is included in the header bar so anytime user can search for their keywords regarding products or friends
Jojo Maria George | Design Portfolio
Funshop
Funshop: Interface Details
45
Login Page This page will navigate the user to his profile. There is a link for registering new account for new user.
Home Page Home page shows activities of friends like shopping, comments or their suggestions etc. It also shows some recommended product to the user. There will be links for friends, favorite brands and recent items. Jojo Maria George | Design Portfolio
Funshop
Funshop: Interface Details
46
Navigation Panel There is a panel hidden in the right side of the screen. There is tap button on the right side and if the user tap on that the panel will appear and leads to another links
Activity Panel It shows the details of the activity of friends and the particular product.
Jojo Maria George | Design Portfolio
Funshop
Funshop: Interface Details
47
Product Details Page
It shows the details of about the product and there are link for ‘add to favorite, add to cart’ etc
Jojo Maria George | Design Portfolio
Funshop
Brochures and flyers
Jojo Maria George | Design Portfolio
48
Brochures and Flyers
Posters
49
KI DUK
Pre- Fest
FILM FESTIVAL
KIM
Seminar Hall, DoD Shutter Bug
Mobile Film Making
Jingle Writing for Advaya
Facebook Panchayat Advaya Workshops
Online Discussion
Sat.
Jinga Lala
01/02/2014
Online Photography Competition
2006 97min.
THE ISLE 2000 90min.
Marketing Plan
Sun.
02/02/2014
Add a Caption
TIME
SAMARITAN GIRL 2004 95min.
3 IRON
2004 88min. Prakash : +91 8822250905 Deeksha : +91 8473995010
Stop Killing Poster designed based on the theme of communal violence in India Jojo Maria George | Design Portfolio
10:30 am 2:30 pm 10:30 am 2:30 pm
https://www.facebook.com/advaya13
Advaya 2013 Poster designed for the annual PG cultural festival of IIT Guwahati
Kim Ki Duk Film festival Poster designed for Kim Ki Duk film festival
Posters
Posters
50
The Painful The Pain
Love
salt solution
sugarďż˝ solution
Copper Nail
The Painful Love
Stop Killing Poster designed based on the theme of communal violence in India Jojo Maria George | Design Portfolio
The Bitter Sweet Love Advaya 2013 Poster designed for the annual PG cultural festival of IIT Guwahati
Kim Ki Duk Film festival Poster designed for Kim Ki Duk film festival
Posters
T Shirt Design
Jojo Maria George | Design Portfolio
51
T Shirts
Logos
52
thumb Jojo Maria George | Design Portfolio
Logos
Illustrations
Jojo Maria George | Design Portfolio
53
Illustrations
Photography
Jojo Maria George | Design Portfolio
54
Photography
Painting
Jojo Maria George | Design Portfolio
55
Painting
Thank You Jojo Maria George M.Des Dept. of Design IIT Guwahati +91 - 8011035727 jojo.m.george@gmail.com https://www.facebook.com/jojo.m.george