5,300+ topics 34,000+quizzes and prediction tests (as of Oct 2016) 420,000+ Paid usersNo.1 customer satisfaction among all e-learning services Adopted in 960 schools out of 5,000 high schools Available in 6 countries No.1 e-learning service for schools in Indonesia and the Philippines Used by 200,000+ teachers Used by 3,000,000 students UIεΩϯ̎ͭ StudySapuri
#AA30DE success-darker Previous result #36A4A1 #FFFFF F pure-white Panel Background, Primary Button’s Text, White Text, etc #00000 0 pure-black alpha12% Covered when button is tapped on Android #00000 0 pure-black alpha35% Modal Background #00000 0 pure-black alpha24% Button drop shadow NOTE: For any text, pure black (#000000) must NOT be used in the application. #FFFFF F pure-whiteɹalphaɹ Background of Animation for Answer, Paging indicator(active) #00000 0 pure-black alpha50% (Not in use) * will be removed primary Primary button color, #0CA5E 6 white bottom button’s bg #F8F9F 9 #24243 F black Text Input Background for selected space primary-lighter #E1F4F F danger Expired soon(todo), #DE30CA success Completed status, CTA #3EC1BD fine Mastered #ddb700 theme Emphasised text, ‘Current’ status, tool- #0B41A 0 d #FFFFF F pure-whiteɹalphaɹ Paging indicator(non- active) background alpha Main background of tutorial over content #1C80E 7 Tab’s background, Banner’s background, background-darker #005FC C danger-lighter Unread messages or #FDEFFB #BFD0 D9 grey1 List Line, Disabled button’s label #E1E8E A grey2 To-do’s ’not started’ status, grey icons, Disabled grey4 Sub text color #808D9 6 grey5 Default text color #4C526 3 theme-darker Status-bar on android #04348 A grey3 placeholder texts #BAC0 C3 primary-darker Submitted #098CC 4 success-lighter Progress bar behind my #D8F3F2 #003A5 A grey2-t Icons which would be placed on color background background Main background #1C80E 7 ready
WHEN TAPPING Buttons 47 Button text should be vertical center aligned. If the text lines are over 2, you can specify larger height. Button text characters should be lower case. Primary Secondary Success Quiz Disabled Primary Secondary Success Quiz COMMON Small font-size: 12pt Medium font-size: 14pt SIZE VARIATIONS Large font-size: 16pt NORMAL STATE DOWN STATE (depends on OS default settings.) text color: pure white background: primary text color: pure white background: success text color: grey5 background: white / grey1(tap) text color: primary background: pure-white / primary- text color: white background: grey2 48 38 30 font-size: 12pt 26 Not in use at the moment Whiteline Whiteline text color: pure-white background: transparent / pure-white Primary Success ready
items should be commonly used through this app. PROGRESS STATUS PROGRESS VARIATIONS CIRCLE size: 32x32 outline: 1px pure-black 12% ICON size: 20 x 20 layout: center-aligned 32 20 32 20 background: grey3 background: primary background: success background: fine LESSON LIST ICONS Text lesson Video chapter Questions not started in progress completed As the light-blue selected panel comes behind these icons, mastered (not in use) reading not started in progress completed mastered (not in use) playing not started in progress completed mastered answering 20 20 Completed content will have a tick icon on it. It will appear immediately after completing the content even if ‘ing’ status above. The reason why ‘mastered’ status 6 5 32 32 8 PROGRESS BAR 12 12 32 12 GREEN BAR background: success GREY BAR background: pure-black 12% PAGING INDICATOR 888 8 ACTIVE NON-ACTIVE 12 This blue background is fixed when scrolling background: background-darker background: primary-darker not started in progress completed mastered submitted ACTIVE NON-ACTIVE 888 8 update
meyco
ryokanakai
inesmontani
mosmos_noki
kei141
rakus_dev
base
baasie
nathanacurtis
kubosho
payatsusan213
takanorip
caraguatatuba
holman
kneath
csswizardry
stephaniewalter
reverentgeek
jonrohan
matthewcrist
sstephenson
addyosmani
mza
davidbonilla
