The document outlines the TelaSocial pilot project at ICMC-USP, which focuses on developing an interactive display system that integrates web content and social media to facilitate community engagement. Multiple prototypes and implementations have been tested, leading to valuable feedback from users regarding layout, usability, and content relevance. The project emphasizes open standards, collaboration within academic settings, and aims to cultivate awareness and interaction within communities through innovative technology solutions.

1. TelaSocial + Lessons
Learned in the "Social Kiosk"
pilot project at ICMC - USP
Marcio Galli - Taboca, alumni @
ICMC since 2000 tvless
mgalli@taboca.com

2. 17 years later..
-1993- 3D Animation and Video ( static work
charged by minute )
1995-1997 - Intermidia Labs ( TCP/IP ) the Web,
3D, and videos;
1997-2000 - Netscape and DHTML
2000-2003 - Open Standards Evangelism
2004-2005 - Web Developer
2005-2007 - Mozilla
2008-2010 - Taboca -> TelaSocial Timelapse
PS: I am alumni at ICMC-USP since 2000. I also spent 8 years at ICMC-USP. This slide is here in case
you are a student at ICMC - University of São Paulo. Otherwise just jump.

3. http://www.w3.org/People/Berners-Lee/WorldWideWeb.html

6. What is this?
It's a black board? It digests the Web? It shows Media? My
own programming can go there? Can I touch it? Can it touch
me? Is it an AD space? "TV de anúncios " - you name it.
Well it's Not Mobile, Not Desktop
Well I see you are using a TV display

7. Is this the Push Web?

8. TV or the Web?
TV Web
4:3 Any Size. Desktop || Mob
16:9 FullHD H264 -> Open Video
Digital TV + Web Remixing Culture,
Broadcasting continues Subtitles to Open Videos.
Challenge - millions of Challenge - missions of
homes will continue to users will continue to
watch broadcast and they interact with open
may get extra stuff such standards such as
as Web?( right side ) HTML5, WebGL and in
social-based services,
p2p models and more.

9. So what is this direction?

10. Directions
Not the Desktop, Not the Mobile
Not a TV, Not the Broadcast, Not an Image
Yes to Ideas, Focus on Ideals
Participatory and to Evolve
Sense of Social
Bring the Web to Communities
Hack in Social Growth
Old TV with open door by
http://www.flickr.com/photos/zagrobot/2688204772/

11. Let's get started ( 2008 )
+ Video Static - In the Mozilla community we did a video in a loop in a event in
Porto Alegre - staff was sick of it, new people was fine to see it once - static
video production BTW;
+ Mozilla summit in Canada had a 24x7 twitter panel for Flickr an Twitter - real
fine and open; Safe people?
+ Pub in São Carlos has 16+ TV panels; At Bus Station in Sao Paulo the use of
panels to see the itinerary; Sao Paulo city has no billboards but increased
number of Ads with panels in subway and other spaces.
TelaSocial started more than 2 years ago. ICMCJr Project by
Paulo Kinicky; Prototypes by Felipe Gomes; Open Source in
Development, Pilot Programs; New projects with Universities
and major conferences in the open industry;

12. TelaSocial is one player
not THE player
Project energies:
* Proposed to Drumbeat Incubator
* Powered by Mozilla
* University Projects - ICMC-USP, Education, panel for K-8-88
* Ongoing planning in R&D
--
* Open Standards Stack ( Gecko / XULRunner )
* Open Source Code ( GitHub )
* Open And Diversity Causes: Events

14. Web stack for a display panel?

15. Soft. Architecture
What is TelaSocial Technically:
* An RSS reader and aggregator
* A RSS visualization display system
* A schedule, a calendar-based events mananger
* A Widget runtime execution engine
Software
* Core Stack
* Linux Scripts

16. Content Flow Overview

17. What is the nature of this project?
How much this costs?
Twitter channel or an Intranet?
Why to run and test ideas like
a project puzzle?
Image credits:
Patrick Hoesly

18. Our ideas about this Puzzle
1 - Loop 10 videos in 1000 people ~ for 365 days
2 - Loop Twitter open channels for 1000 people in 365 days in
varios locations physical
3 - Technical geeks calls for medias: Animation, Flash, Videos,
Slides, Pictures
4 - Around cases: TV, Fastfood, Bar 16 TVs, Flash animation,
Powerpoint in other countries, Semana da computacao video,
Mozilla Kiosk FISL video 24x7
5 -Other cases: How we navigate the web; We click to find
things; Very individual, sometimes social, sometimes pushed
by our cultural environment;

19. It pays off to do this?
It may give...
* Sensation Awareness
* Understanding
* Thoughts
* Chance for Action
Well now that we did it, show me the heat

20. Pilot: We seeded and added water

21. Oh - you call these petals?
*

22. .. a week with water and sun
During Freshman Week at ICMC-USP a whole week 24x7 with
the panel and we recorded images and tested a number of
web-based and social-aware scenarios:
Content: Event Week Calendar; Alumni Area; Free open Twitter
channel; News from USP site; News from Slashdot, oops even
a slight hack - party?
Check full report:
http://www.telasocial.com/p/icmc-piloto/index.html

23. Cases: And, e seeded in different
halls in the campus
A Panel was installed next to a professors rooms area next
to the door of a major conference room:
* At an event people were bouncing at the door - the
presentation was in another room; Panel did nothing about it!
* Post-its notes in there said things like: Useless information,
ugly layout, sounds like advertising, spam, our image falls;
A Panel was installed next to a security guard at the ICMC-
USP Block 1 hall next to a security guard:
* Security: "Hey what about that printer? - the students don't
know how to use the printer man."

24. What friends of the project are
saying?
Juliana: Large fonts ticker view for a 30 meters view!
Fran: used twitter to talk to students - she uses twitter to create
connection points with students already;
Rudinei: Need link to project on what is this;
Solange: Need dates and better calendar view;
José: Can this show stock options?, videos?
Others:
+ Layout noisy - too much text?
+ What was the text again? I could not read
+ Videos - whatever is it! - it calls attention
+ Alumni : Sent greeting messages in the panel!

25. Questions and Perceptions
Aspect Ratio: 16:9 - Horizon
Horizontal Box: WorldCup - wait it's HD! god woldcup is
coming;
Horizontal Box: Is as powerful as a TV broadcast - put a
SOAP opera is fine but something bad can really hurt
Horizontal Box: Darn it ! is it a Reality Show now?
Horizontal Box: Hell it! you talking a advertising forum?
What are our perceptions?
+ We look around, we compare
+ We look in Images. Do we think in Ideals

26. Perceptions: Images and Ideals

27. Perceptions: Walls
What a technology?

28. Perceptions: Walls
That's a geek in there!

29. Perceptions: Walls
Another geek hall next to staff people - public investment
pushes good food.

30. Perceptions: Walls
The border of the TV is a hall? why? why a thread? and why
again that printer?

31. Perceptions: Walls
In Lab Caves we found painting

32. Perceptions: Walls
Any base is a platform for a growing petal?

33. Perceptions: Walls
Wait - this is not vertical or horizontal?

34. Perceptions: Walls
Even in the transparency

35. Cases and Future: Walls
And the winner is...

36. What we think so far..
Aspect Ratio: 16:9 - Horizon
Black board is horizontal
TVs are horizontal
posting boards can be both and are in use
ads are A4, A3 are everywhere
Panel is not satisfactory ( ICMC-USP )
TelaSocial Challenge - Look at this picture from another
angle: Not paid programming. Not using values from
mainstream TV industry or AD industry. And maybe not
believe that what was in the "TV" is the truth.

37. Options
One thing is to make Another thing is to have this
something we can do it now open-based board and local
- we have some sources we power to community that we
have the people already know we will step in weird
communicating - the intranet things - not a big problem
is ready. This is with the open but this is
"Cotidiano" is AGILE NOT AGILE - it can be slow
in some organizations

38. Wait! there is the side B in my disc
Things are not Black or White
What are my options?
* A is Agile, A is A grade in the grade structure of university
scenarios - we love to give As. We have a model to put it now!
But, Professor Santana mentioned something at the students
award cerimony. We want to get better in value other things
aside from standard grade.
In the grade filter, an analogy for content ranges:
* B is to be nice ( slight open )
* C let's see ( quite open )
* D is darn it ( are are overboard )
* E is error ( you did wrong )
* F is fail ( you failed )
* G is save me God ( you are out of here )

39. What are options of B,C,D,Etc. ?
* Let they talk total?
* Involve communities and realities
* Create awareness and possibilities for cross-relationship of
the internal developments ( academiy and tuition ) with life long
and interested parties beyond physical range of campus
* Even communication and marketing ( self propaganda ? )
* Boost communication pipelines:

40. Side B in my vinyl, tracks
* 3:45 Clean and Standardize the pipelines
* 5:34 Optimize the chain
* 2:00 RSS Beat
* 3:15 Events Department Sirloin
* 4:15:Video/Image Department Sweet Pineaple
* 3:10: Remove the fossas AKA Reduce Reuse Recycle (
hidden not reusable work )

41. At ICMC-USP
Tracks become Criteria
Workflow relationship
Content
Interaction
Susteinability and Governance

42. Criteria: Workflow relationship
System reflects the workflow of information within the local
community - department first, working groups, employees,
and the wider community.

43. Criteria: Workflow relationship
I look in the mirror and I know someone else is next to me too.
Feedback says: problems with Latec characters which is not human readable
and also dimention and positioning.

44. Criteria: Workflow relationship
RSS ( main usp.br ) // http://www.icmc.usp.br/eventos/feed/
RSS: ( Agência USP )
From Brazil.gov.br :

45. Criteria: Content Channels
By Media ( We geeks use this model )
Video or Animation; Vector Graphics, Canvas, OGV, HTML5-
based widgets, WebGL
By Subject ( get the TV programming, NOT )
Job and internship opportunities, awareness about open
causes, conferences adaptation, alumni channels, food, stock
options - programming changes by week - you do your baby
steps - no hurry to push.
By Rights
Creative Commons, CC0, folkscasting

46. Criteria: Interaction
Interactivity
* TouchScreen is when I touch the panel
* TouchingScreen is when the panel touches me
Controlled interaction: Intranet and user account based;
Social Interaction: by channel - we can enable based on
calendar - choreography rules;
Identification and threading: we tested QR-code in the panel
as a means to show cases where user can capture
information. It works for new phones. For social-interaction
we tested with Twitter and other systems.

47. Criteria: Sustainability + Governance
If the software project dies what happens?
Less duplication of content
Add strength to workflow and communication
Standards-based improves involvement for customization
Add social strenght over time - hope and goal for TelaSocial
infra-structure. API wants to facilitate that.

48. What others are doing?
Case of FISL proposal ( event with 8K participants in 3 days)
They have already the channels:
* Twitter ( people streaming )
* Identi.ca ( people streaming )
* Flickr ( In the wild too, people picture streaming )
* TV Software Livre ( controlled video streaminng )
* Radio ( controlled audio streaming )

49. Cases and Future:

50. Q&A and Future
mgalli @ taboca.com
@ICMC: Upcoming Course - Customize your Own Social Kiosk
with Web-based Standards; Student projects for ICMC
customization - ask professor edson@icmc to get involved;
Improve the Events/Agenda Widget; Call for other widgets
devolopment;
@TelaSocial: Contests for Customization and Nich-based Social
Causes; Upcoming major open-source conference to use; Get
started in K-8+ schools
@Mozilla: Continue to break down software component values as
an API for a wider range of Web developers - first in Mozilla
platform - Jetpack API - Proposal project with Armando Neto.