New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Buyers Guide: Creep-O-Meter animation #1859

Closed
kristinashu opened this Issue Sep 25, 2018 · 10 comments

Comments

3 participants
@kristinashu
Collaborator

kristinashu commented Sep 25, 2018

Feedback from Tais' usertesting found that users felt the current simple face animation didn't really represent their feelings of being creeped out. Would be good to draw out more creeped out keyframes and uplevel animation to something a little more rich.

Examples of richness, not creepiness:

Please do it in your own style, these are just examples.

@kristinashu kristinashu added the design label Sep 25, 2018

@kristinashu kristinashu added this to To Do in Buyers Guide via automation Sep 25, 2018

@kristinashu kristinashu referenced this issue Sep 25, 2018

Closed

Buyers Guide: product page #1819

8 of 11 tasks complete

@kristinashu kristinashu moved this from To Do to In Progress in Buyers Guide Sep 25, 2018

@natalieworth

This comment has been minimized.

Show comment
Hide comment
@natalieworth

natalieworth Sep 26, 2018

screen shot 2018-09-26 at 4 09 27 pm

@beccaklam @kristinashu before I start animating anything—do you think these 5 'key' faces convey better emotion/ understanding of creepiness? I'll also put them on redpen if you want to leave comment in there. https://redpen.io/p/wfa33bfccd9fe4f98e

natalieworth commented Sep 26, 2018

screen shot 2018-09-26 at 4 09 27 pm

@beccaklam @kristinashu before I start animating anything—do you think these 5 'key' faces convey better emotion/ understanding of creepiness? I'll also put them on redpen if you want to leave comment in there. https://redpen.io/p/wfa33bfccd9fe4f98e
@natalieworth

This comment has been minimized.

Show comment
Hide comment
@natalieworth

natalieworth Sep 26, 2018

faces_v-3.ai.zip
@beccaklam There is the .ai file too for the faces (if you want to mock them up to see how they look in your comps).

natalieworth commented Sep 26, 2018

faces_v-3.ai.zip
@beccaklam There is the .ai file too for the faces (if you want to mock them up to see how they look in your comps).

@kristinashu

This comment has been minimized.

Show comment
Hide comment
@kristinashu

kristinashu Sep 27, 2018

Collaborator

This is gonna be amazing!

Some notes from convo with @gvn:

  • he needs one svg face to test with
  • we will have about 30-40ish faces in total (but will have some back and forth to figure out how to balance smooth animation with load-time and effort)
Collaborator

kristinashu commented Sep 27, 2018

This is gonna be amazing!

Some notes from convo with @gvn:

  • he needs one svg face to test with
  • we will have about 30-40ish faces in total (but will have some back and forth to figure out how to balance smooth animation with load-time and effort)
@natalieworth

This comment has been minimized.

Show comment
Hide comment
@natalieworth

natalieworth Sep 27, 2018

Added 2 other more subtle options of the emoji styles in redpen. https://redpen.io/p/wfa33bfccd9fe4f98e

cc @kristinashu @beccaklam

natalieworth commented Sep 27, 2018

Added 2 other more subtle options of the emoji styles in redpen. https://redpen.io/p/wfa33bfccd9fe4f98e

cc @kristinashu @beccaklam

@kristinashu kristinashu referenced this issue Oct 2, 2018

Open

Buyers Guide: build creep-o-meter #1888

2 of 5 tasks complete
@natalieworth

This comment has been minimized.

Show comment
Hide comment
@natalieworth

natalieworth Oct 3, 2018

Creep-o-meter draft!!! AH! It's been tricky to get the transitions to not look weird, but hopefully if it's sliding it'll be less weird:
face-test-02
cc @kristinashu @beccaklam

natalieworth commented Oct 3, 2018

Creep-o-meter draft!!! AH! It's been tricky to get the transitions to not look weird, but hopefully if it's sliding it'll be less weird:
face-test-02
cc @kristinashu @beccaklam

@beccaklam

This comment has been minimized.

Show comment
Hide comment
@beccaklam

beccaklam Oct 3, 2018

whooaaa @natalieworth so cool and smooth :)
Yeah the only weird thing is the teeth that come out from the creeped out face to the happy face. but does it even need to transition between the two? wouldn't it just go backwards?

beccaklam commented Oct 3, 2018

whooaaa @natalieworth so cool and smooth :)
Yeah the only weird thing is the teeth that come out from the creeped out face to the happy face. but does it even need to transition between the two? wouldn't it just go backwards?

@natalieworth

This comment has been minimized.

Show comment
Hide comment
@natalieworth

natalieworth Oct 3, 2018

@beccaklam Yah! It could essentially only go back and forth, so it wouldn't have to loop seamlessly.

natalieworth commented Oct 3, 2018

@beccaklam Yah! It could essentially only go back and forth, so it wouldn't have to loop seamlessly.

@kristinashu

This comment has been minimized.

Show comment
Hide comment
@kristinashu

kristinashu Oct 3, 2018

Collaborator

Soo cute and expressive!

Collaborator

kristinashu commented Oct 3, 2018

Soo cute and expressive!

@natalieworth

This comment has been minimized.

Show comment
Hide comment
@natalieworth

natalieworth Oct 5, 2018

Documenting these files here:
5 key faces (svg):
5-faces.zip

Exported individual frame pngs:
face-png-animation.zip

natalieworth commented Oct 5, 2018

Documenting these files here:
5 key faces (svg):
5-faces.zip

Exported individual frame pngs:
face-png-animation.zip

@kristinashu kristinashu moved this from In Progress to In Review in Buyers Guide Oct 5, 2018

@kristinashu

This comment has been minimized.

Show comment
Hide comment
@kristinashu

kristinashu Oct 9, 2018

Collaborator

Sweet! I think this is all done and amazing.

Please reopen if you still need it tho!

Collaborator

kristinashu commented Oct 9, 2018

Sweet! I think this is all done and amazing.

Please reopen if you still need it tho!

@kristinashu kristinashu closed this Oct 9, 2018

Buyers Guide automation moved this from In Review to Done Oct 9, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment