anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

fix(feedback): improve design of feedback flow, correct several logic issues

Browse source
This commit is contained in:
Jason Dreyzehner 2016-11-16 18:15:55 -05:00
commit f7e6f30d12
13 changed files with 85 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

4
www/img/icon-language.svg
View file

@ -5,7 +5,7 @@
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Icons" transform="translate(-277.000000, -769.000000)" stroke="#8F8F90">
<g id="Icons" transform="translate(-277.000000, -769.000000)" stroke="#9b9bab">
<g id="icons/list-items/sync" transform="translate(278.000000, 770.000000)">
<g id="Group" transform="translate(0.347826, 0.378151)">
<path d="M14.889225,12.3491049 C16.1172023,11.0140665 16.8846881,9.34526854 16.8846881,7.50959079 C16.8846881,3.33759591 13.1240076,0 8.44234405,0 C3.76068053,0 0,3.33759591 0,7.50959079 C0,11.6815857 3.76068053,15.0191816 8.44234405,15.0191816 C9.28657845,15.0191816 10.0540643,14.9357417 10.8215501,14.685422 L15.3497164,16.6879795 L14.889225,12.3491049 L14.889225,12.3491049 Z" id="Shape"></path>
@ -13,4 +13,4 @@
</g>
</g>
</g>
</svg>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

Before After
Before After

4
www/img/icon-notifications.svg
View file

@ -5,7 +5,7 @@
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Icons" transform="translate(-542.000000, -768.000000)" stroke="#8F8F90">
<g id="Icons" transform="translate(-542.000000, -768.000000)" stroke="#9b9bab">
<g id="icons/list-items/sync" transform="translate(543.000000, 769.000000)">
<g id="Group" transform="translate(0.392391, 0.413043)">
<path d="M6.28767826,13.3123913 C6.33555,14.6357826 7.36361522,15.6956522 8.6326087,15.6956522 C9.90160217,15.6956522 10.927313,14.6357826 10.9759696,13.3123913" id="Shape"></path>
@ -15,4 +15,4 @@
</g>
</g>
</g>
</svg>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

Before After
Before After

4
www/img/icon-send-feedback.svg
View file

@ -5,7 +5,7 @@
<desc>Created with sketchtool.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Icons" transform="translate(-666.000000, -770.000000)" stroke="#8F8F90">
<g id="Icons" transform="translate(-666.000000, -770.000000)" stroke="#9b9bab">
<g id="icons/list-items/sync" transform="translate(666.769231, 770.000000)">
<g id="Group" transform="translate(0.368286, 0.383523)">
<g id="holidays-24px-outline_message" transform="translate(0.298380, 0.949811)">
@ -20,4 +20,4 @@
</g>
</g>
</g>
</svg>
</svg>

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

Before After
Before After

BIN
www/img/illustration-send-feedback.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 40 KiB

Before After
Before After

66
www/views/feedback/complete.html
View file

@ -1,81 +1,51 @@
<ion-view id="complete" hide-tabs>
<ion-content scroll="false">
<a class="close-button" ng-click="close()"><i class="icon ion-ios-close-empty close-home-tip"></i></a>
<div ng-show="skipped && isCordova">
<div ng-show="score > 3">
<div class="title" translate>Invite friends to BitPay!</div>
<div class="text-center">
<i class="icon addressbook-icon-svg">
<img src="img/address-book-add.svg"/>
</i>
</div>
<div class="subtitle">
<span translate>Share the love by inviting your friends.</span>
</div>
</div>
<div ng-show="score <= 3">
<div class="title" translate>Thank you!</div>
<div class="subtitle">
<span translate>A member of the team will review your feedback as soon as possible.</span>
</div>
<div class="subtitle" ng-if="score <= 3 || !isCordova">
<span translate>If you have additional feedback, please let us know by tapping the "Send feedback" option in the Settings tab.</span>
</div>
<div ng-if="score <= 3 || !isCordova">
<div class="text-center">
<i class="icon icon-svg">
<img src="img/illustration-send-feedback.png"/>
</i>
<div class="complete-layout">
<div class="complete-layout__expand" ng-class="{'fade-in': !animate || socialsharing}">
<div ng-switch="score && !skipped || rated">
<div class="title" ng-switch-when="true" translate>Thank you!</div>
<div ng-switch-default>
<div class="title" translate>Share BitPay</div>
<img src="img/ico-positive-feedback.svg" class="share-the-love-illustration"/>
</div>
</div>
</div>
</div>
<div ng-show="!skipped || !isCordova">
<div class="title" translate>Thank you!</div>
<div class="subtitle">
<span translate>A member of the team will review your feedback as soon as possible.</span>
</div>
<div class="subtitle" ng-if="score <= 3 || !isCordova">
<span translate>If you have additional feedback, please let us know by tapping the "Send feedback" option in the Settings tab.</span>
</div>
<div ng-if="score <= 3 || !isCordova">
<div class="text-center">
<div class="subtitle" ng-show="!skipped && !rated" translate>A member of the team will review your feedback as soon as possible.</div>
<img src="img/ico-positive-feedback.svg" ng-if="rated && socialsharing" class="share-the-love-illustration"/>
<div class="subtitle" ng-if="score > 3 && socialsharing" translate>Share the love by inviting your friends.</div>
<div class="subtitle" ng-if="score <= 3 || !socialsharing" translate>If you have additional feedback, please let us know by tapping the "Send feedback" option in the Settings tab.</div>
<div class="text-center" ng-if="score <= 3 || !socialsharing">
<i class="icon icon-svg">
<img src="img/illustration-send-feedback.png"/>
</i>
</div>
</div>
<div class="text-center" ng-if="score > 3 && isCordova">
<span translate>Share the love by inviting your friends.</span>
</div>
</div>
<div class="share-buttons" ng-if="isCordova && score > 3">
<div class="ng-hide" ng-show="socialsharing" ng-if="score >= 4">
<div class="share-buttons__action ng-hide" ng-show="facebook" ng-click="shareFacebook()">
<div class="share-buttons" ng-show="socialsharing" ng-class="{'slide-up': !animate || socialsharing }">
<div class="share-buttons__action" ng-show="facebook" ng-click="shareFacebook()">
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-facebook.svg"/>
</i>
<div>Facebook</div>
</div>
<div class="share-buttons__action ng-hide" ng-show="twitter" ng-click="shareTwitter()">
<div class="share-buttons__action" ng-show="twitter" ng-click="shareTwitter()">
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-twitter.svg"/>
</i>
<div>Twitter</div>
</div>
<div class="share-buttons__action ng-hide" ng-show="googleplus" ng-click="shareGooglePlus()">
<div class="share-buttons__action" ng-show="googleplus" ng-click="shareGooglePlus()">
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-googleplus.svg"/>
</i>
<div>Google+</div>
</div>
<div class="share-buttons__action ng-hide" ng-show="email" ng-click="shareEmail()">
<div class="share-buttons__action" ng-show="email" ng-click="shareEmail()">
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-email.svg"/>
</i>
<div>Email</div>
</div>
<div class="share-buttons__action ng-hide" ng-show="whatsapp" ng-click="shareWhatsapp()">
<div class="share-buttons__action" ng-show="whatsapp" ng-click="shareWhatsapp()">
<i class="icon socialsharing-icon">
<img src="img/social-icons/ico-social-whatsapp.svg"/>
</i>

9
www/views/feedback/send.html
View file

@ -2,9 +2,14 @@
<ion-nav-bar class="bar-royal">
<ion-nav-back-button>
</ion-nav-back-button>
<ion-nav-buttons side="primary">
<button ng-show="score" class="button no-border" ng-click="sendFeedback(null, true, true)" translate>
Cancel
</button>
</ion-nav-buttons>
<ion-nav-buttons side="secondary">
<button ng-show="score" class="button no-border" ng-click="sendFeedback(null, true)" translate>
Skip
<button ng-disabled="!feedback.value" class="button no-border" type="submit" ng-click="sendFeedback(feedback.value, false)" translate>
Send
</button>
</ion-nav-buttons>
</ion-nav-bar>

2
www/views/tab-settings.html
View file

@ -31,7 +31,7 @@
</a>
<a class="item item-icon-left item-icon-right" ui-sref="tabs.feedback">
<i class="icon big-icon-svg">
<img src="img/icon-send-feedback.svg" class="bg"/>
<img src="img/icon-language.svg" class="bg"/>
</i>
<span translate>Send Feedback</span>
<i class="icon bp-arrow-right"></i>