Bestand wählen
Merken

Designing for Ember Apps

Zitierlink des Filmsegments
Embed Code

Automatisierte Medienanalyse

Beta
Erkannte Entitäten
Sprachtranskript
so and the in the in the in the and and I made a slide sparsity if there's no presentation I say satisfy problematic for all this
year building number when designing a house the I chose metaphor the house because much like the applications that were able able and capable build member where uh were doing with an infinite or impossibly large number of use cases and almost all there are rules and regulations in place that we both have to discover but also beyond that have of hold hands and you abide by the makes for a very complicated jobs and technologies like amber actually allow us to create digital solutions that couldn't possibly imagine just few years ago and the up again a number of use cases that were encountering the product service overwhelmingly large everyone uses of different so important for us to understand our audience and Mark Oldman solutions they so we're also building a lot them were building a
vast network of interconnected experiences the and I'm going to be a vector
adopted our design didn't suffer canceled the there's boss Massachusetts something like no loss and perhaps for efficiency get rather than the
if at all thank you so much get so my talk to about signing some of its applications the and I broke my talk and a couple parts we intend to explain the 1st part of my talk Nubia any answers hate the
house that you don't we use the house the formal way hey the house that you built front door that you chose initio little respect for you and challenges that faced in creating the solution really is satisfied responding to taste even if the dividend for free open source I'm saying how much pain because the are acknowledging a commitment to the right that some familiar sure lot and and the news the audience what the world making things
people in so how do we stop for
users and speeding all over serious it's like
this I'm just so excited aversive slide
both of we don't marry them it but
2nd we start with mental models the can
understand where users coming from who they are and what types of interactions they deal with on a day-to-day basis that may be war world are scenarios the so we know it meant
follows have experience working with the most not having impact your perception of replication get the hands of the goal nobody of so many models of what I think the thing is and how I think thing works as user so that is all developed really
from my past experiences so experiencing 1 object say a laptop and I come to another laptop expect a certain type of experience and it's a lot of this is on a lot of this is the net you expect your experience solution to match those we experience at least improve upon them so know it's solid mental model is ever evolving as throughout my life as a come into contact with an object is used they can be updated changed by so innovation so if I improve on good feature function it's it's great for us to release that on world views our apps and have become a new factor standard pulled a refresher actually of scenarios which is kind outdated but for the time being was a really great stereo and that sort of built itself into mental models uses the fat content it's so you take the whole
metaphor for the organ try to analyze what I think wholeness and what is home how in your home is hominid mental model this all home it is really because the poem is greater than the concept of is the sum of all the features that are match the opposite and it's more than just the kitchen sink at more than the couch the total experience think of home I think a lot of things things is on
certainly not right so we restaurant the gives a running away to form a rival students encompassing me this is perhaps the of
God sold it to letters for me I'm not worthy
and and you're going into the site this is this is not right this matters all of our models for understanding what home should be the best things about this characteristics visually the real tired and really cleanly clearly the windows of to with the height the EPA distance from each other there's a door the gutters route believes itself particular shape it's often nestled in other buildings so much at this may all seem really obvious to you but this evolves over time if we compare this to this
the notice of this actually still kind of seems like a home but you judging values from very different from the other house because they're very unique characteristics said that rate among market-making differ from each other but they still share some common common expenses common design that stars windows stills roof sketching means that door for access is something about this that makes it a very weird and that's really the sheltered and your interpretation of values object is based off of your previous expensive and how those functions and seeing how this on my function differently than yours the
the 2 types of mental models to be aware of apps there's a macro which is really the point here we have a house that's from a distance it's before action had a chance to interact with a micro level is the assessment that I make on what I believe it's going to do to warm and the thing that makes the log
the thing that makes much try that experience at 1st I want people itself is marketing but I have a different approach that part of the yeah map experience is how I
think the individual interaction works itself and how I think it like a specific feature or as it's also what I think the application will do a on an individual feature feature basis and alternately micromodel is where the core value for interactions of product are derived this is his last house
that promises so this is the door look at that things that at a micro level this is like a particular feature of the home it's gonna handle it turns the dorms going school in our closest and so on and so on and that's great since 3 simple this is a
different story I mean in if I could interact with this this is actually person with a lot of experience that when you come to
believe that you know this is the way things are going to be this is how to find work this is what I should come to expect and summary decides that their
applications super secure and and all these blocks uh just really interrupt my flow process on a micromodel model this doesn't this doesn't quite match if from printed out the feature list of course the match like over doors following the same vigilance should
open to push a lot God I have this is the whole
metaphor real-time so experiences and how mental models actually apply to the that what we're creating today so give us may be familiar with the Motorola Razr anybody of us have the following year and it is miserable sending messages that were in ignore the keyboard on the phone where talk about this interface here assume a large space for composing message we have an OK but the bottom right this put this together that some of
you are more prominent role in the offices and I think it's really depressing and so as always messenger I should use my laser from here and I think it's going to be considered but there's a bunch of erroneous features that we can ignore that think of function of them as we push forward and Japanese applications and texting but generally this is the same thing we have become large composure bottom MSN but the bottom line there has been added a dialog so we can see that history right here nest
is a very squished view of apples messages application yeah again there are things that are really really similar to each other before the Motorola Razr experience to be to the site to the
valence messenger for images and so on but the messages we don't we don't have that large of like a mental job right but we use very short I use across the still the messages box the bottom and when you start typing a message you are able to hear it said this is my favorite example the
Bonino this experiences just by looking at when risen allocable prolyl embarrassed so this is standard tender is communication experience the so we wouldn't be in
this 1 and this 1 but this is this is
not different I I believe the Android phone out so enjoyed tender applications it operates very much the same way at the point here is that uses a tender RD already have a model for a shorter transmission line the really high frequency communication those called texting existed so
they're able to take from this experience and but
we model the behavior and application because that's what they want us the new users radius this is critically important note somewhere out there in the world at our audience applications that you're building bombs you can solve their models for interaction already exists both macro and micro and if you're able to build applications is
designed in such a way to utilize those whether their patients are strikingly similar or even competitors we're able to build a framework of
understanding the it's can allow me to get to know your application to see the value in the separation more usable and also these nuclear power to learn so locations of very difficult learning path that you believe in the nite so much the willing to dig through of it always has to be the case this is an example of a
direct copy they gets used to study that permanent models is different from directly copying a competitors solution as as a should be tender in messages competitors really promoting Apple's platform by using that space ultimately people move off gender and start using texting anyway so it's not really competing with perhaps soluble all selling messages Apr it's their base after the product and so we nature forcing people so don't got
the distribution and models applied here's your experience you should use them explicitly if they
directly applied to experience so I've already interactive Julien radio buttons in the world the messenger redesign array of like all the time In some cases there may be unique value to be gained from the micro level of generally you can just keep reading but you want break them where you
can improve the understanding value products this is a
really good example of that and when this the people pulling this is just by looking at this part I just wanted to focus the shot here but this is the 1st generation iPod then was not lucky enough to have on I had a bunch of really crappy every 3 players but all the other major players of the time operated on and you can so if you navigate through folders of media to gain access to certain music you actually have a cross of press down like navigate in the right way back out and you decide that most of us Apple actually produced a really problem assigned for this you can use 1 continuous motions constant tapping exhausting tapping annoying clicking sounds you can use that 1 continuous motion which is actually kind of fun and much quicker more quickly moves through while structures of course we change the paradigm of of folder structure over time that's how things work that this period so they both increase the ability for users to who their product but they also created some of that it's really you need this is an example of a micro model here or a micro interaction so this is just 1 part of the whole and differentiating here made a big difference travel so so how can we
know our applications start creating experiences that delay the user's differentiated products so much and likes really cement the value of a product you might
we wanna do that through creating repeatable design methods and design patents I for both interactions and in the some the so we can talk about 5
major ones so 1 is that engagement this is really more of a method Our than anything some so if the pattern is going to be very different every property like but the idea that engagement can reduce the perceived risk of signing up for application by allowing them to get to know it over time example of that is
tender and so from a sample to start the radio they actually drop you write down homepages in communications and up a radio that that radio on my head and a play stations that only I like so radio personalization get into a single text so start typing of and the
forward and my it's not like they get a core value this product is already serving as its music can listen to it for free I'm able to access instead Pandora's boldly trying to provide forming and why I should like it why should users but in a sign of it after a number of songs then they tell you ask you to sign up to continue playing a radio we've already in life and then it's a much easier sell this is a video and
unfortunately uh spin dimensions along
but the shock the effectively the same thing
their learning this this is where double standards
yeah and saying of you're perfectly I but
done here I'm adding all stare
album my favorite ones of those and I'm
playing like they get so much so that experience level point to doing real work from outside the learning of the UI that's a good thing and then do you I I found the value may be safe so I can't complain
about stands for a little bit of neural them early sky a lot of them there's some cases we might like it then I understand but I there's a better way of as was built a new 1 so this is Google Maps
missing attributed see on the screen but there is a grid that's in the background that resembles content to be effect is the child does new have a line up with the image that's rendering but the idea is that you can give your users of an increased sense of speed of your application by providing some standard error scaffolding come is renders an
OK job it's In see what it is we do the bare minimum certain instances where but their minimum I think for the application for skilled in UI but it's still hot still better than just having a blank screen was spent Securenode is an avatar that's gonna show up I get labels for proposed followers and following my following unfold but it's just sitting there saying loading for some reason that is the new world so that the loading the this actually there's a much better down this is the application of course role and so the the web
application it is so if you can see there's a little bit an animation on the content
or the scaffolding and still to your we have the and gives you much better sense that
something's happening the product of moving forward is listen to your requests in encounters coming
down away all time the problem is is
really well I think they do best
interest there's the source of the image height or dimensions to produce their task as they do here and since it is an experience really kind of a log book by doctorate to create boards using
interesting I I've run for all of us
from the people really use this as much as I do and but it also source the base color from all these images and they presented that then they will be images in the 3 simple it's beautiful and
actually fits really well but more interaction of the
product no thing is that we could be doing better at carrying context the so don't leave me at when it was if 1 parent chaperone over the bus driver does have a bus stop expect parents that and I think that's true for
applications so it really good example of his argument spot so this case if I'm playing RD on my laptop and I go over to my iPad and similar types other and and 1 change the song is playing on the speakers governance and somewhere else I can actually tap here so I might still work in teams a song that's great attention operate my application from all the location and extent test it you that here
as well as the Breslow's was that's obviously added functionality and see that it's currently engage with elsewhere and but I also get a greater sense the system really knows where I stand knows more about me in migrants going to the AP in presence of actin by those
effectively if you use their job they very unlikely started at a better although spot bisexual engineering seems to be better faster and but this is what we call an inner calm or generic message adopted and it is effectively just say you music is not secure ourselves become indication of the give indicated that they give to you you're on a device is no longer at the control points being so track the application of blocking from interacting environment and making changes in this 1
case records are give an example from major said so is continuous training music that's really that's really easy thing to understand why should people operable conditions but there's another imagine you're giving a traitor making a trace of a couple hundred thousand dollars and it's of the hearing investment for clients and it's 355 and you gotta get it in but for the market close for a blog pressure in the middle of making the trade and secure computer dies or something that just catches on fire on the circuit and then you were then you're able to pick it up in the following ImageTable despicable found log into a website and pick up right where you left off I see that you made it halfway 7 so way through the trade intrinsic information about how you want to work and she can trade done to me to say if you could save your client hundreds of thousands dollars it's a result of jobs core interactions are really
more micro model where but there are other things that cement in that value so the whole reason some much application began with yeah this example of reusing core
interactions some applications have many of them other ones have just a few when show you right now is the way that where that intersectional works
so core direction and just really is going a tangent is just browsing just looking at something becoming interested clicking on again
find something else looks just like it anywhere you go in and terrestrial to click and following tangent so that's that's repeated core interaction here an
example of abandonment actually this
little work when you so the core interactions become
a symbol of our ap so like when we come to understand the value in the sense wires these have to begin with and you repeat that over time that micro model of the individual interaction extrinsic having overrides become the macromodel will become what I remember your application by apply go home and I think of your application I think of those things into the experience and the biomechanical and drink it and I fukoku what I think about about the extent of thinking of that about necessarily like the ad was somewhat and this the same same is true for applications an example of
opinion or interaction 3 what we produce the we've been obsessed above this stand for while and essentially you just use the same interest you win or lose by I think this game actually only lives and I waste a
least idea I don't think you never get to point where it's like
to use it to the to the universe the speak you my point like is only 1 way to introduce happening repeat that super super simple obligations course are often much more complicated than that but it's important identify where users to write to retrieve core value from applications and find ways to replicate their mental model of that very efficient were worries another example
of an interaction is repeated that provides a very serious value I think is the the iPhone from Princeton this effectively is de-facto authorization interaction so too long my phone might trapped in its great analysis body refer lemma by a book iTunes a book and I works for it's an element in whatever maybe there is always an opposite of positions and improved instead that of quite a bit by allowing me to have told by thunder answer type an acid but it also repeated this in multiple similar scenarios instead of just only want to know what you are saying and your phone or online in so subpoenas for interactions penis interactions on a cement in this case a sense of security in Iraq but also the future value and users of so called life mode
and been because it's like the bill of this great fantastic application like it solves everything you user needs runs raving about and then your user loses internet connection and the it's like snow cave the roof and the Baptist instead there's no there's no value again from to be decided on and most cases we shouldn't is 1 example where I
get really angry this is actually a document as a way sort of trying to that's all I can do anything I'm just like sitting here walking at that little yellow thing in US the website of Google Docs doesn't show me that I interact with it and start typing happens it's incredibly frustrating this
so I think of a box so this modifying
the display you know generic messages slightly cut up here but connection-less connection lost at I see this their presses and know is an issue it's very different from the rest the it's really easy to see and understand but they still it like like an application even though the museum new music is can I or would like to have like the browsing album I know and not a skull of perhaps if I removed something of a book that previously maybe it will react to load immediately that the no like this term
responding optimistically I think we should be careful what
this thing is often no is again this really just so I can like making actually interacts with core interactions of incidents product and rubber without being online at all presumably when the interconnections on my gamma connection is re-established server it concerns the updates will store those due them up father and the
ideal certain is can always do this obviously we don't pretend like something happens it's sensitive thing but if it something like an instant case where the user closes the browser before you had a chance think server and they come back to the sensorimotor phone they're not considered image anyway the actually poses no real effect on future life to really just a moment in the recognizer with
that we are working on a project to effectively create a design pattern library so we want a document methods design patterns for use directly applications for Amber 1 provide examples of certain implementations of those of you who can help our community grow in our community building design the applications were enchanted that through product . tools of the trade but
right now you can sign up for our release date and tools this trade adopted outcome uh but what we really have to do once we got the 1st initial patterns of the door and methods for you to help so if you're experiencing challenges and you have a desired solution that you think is workable helpful to the rest of the community with begin to help a lot of interest this and increments into the future
in the and
Streuungsdiagramm
Rechenschieber
Offene Menge
App <Programm>
Schwach besetzte Matrix
Kombinatorische Gruppentheorie
Kombinatorische Gruppentheorie
Dienst <Informatik>
Prozess <Informatik>
Korrelation
App <Programm>
Gebäude <Mathematik>
Zahlenbereich
Schlussregel
Kartesische Koordinaten
Biprodukt
Regulator <Mathematik>
Unendlichkeit
Einfügungsdämpfung
Datennetz
Benutzerschnittstellenverwaltungssystem
App <Programm>
Mereologie
Kartesische Koordinaten
Vektorraum
Einfache Genauigkeit
Homepage
Freeware
Rechter Winkel
App <Programm>
Open Source
Formale Grammatik
Hinterlegungsverfahren <Kryptologie>
Rechenschieber
Informationsmodellierung
App <Programm>
Datentyp
Basisvektor
Interaktives Fernsehen
Modelltheorie
App <Programm>
Stereometrie
Videospiel
Lineares Funktional
Gewicht <Mathematik>
Sichtenkonzept
App <Programm>
Güte der Anpassung
Quick-Sort
Teilbarkeit
Gesetz <Physik>
Objekt <Kategorie>
Informationsmodellierung
Notebook-Computer
Datenreplikation
Datentyp
Modelltheorie
Standardabweichung
Informationsmodellierung
Gewichtete Summe
Total <Mathematik>
Selbst organisierendes System
App <Programm>
t-Test
Gerichteter Graph
Informationsmodellierung
Shape <Informatik>
Web Site
App <Programm>
Gebäude <Mathematik>
Bildschirmfenster
Grundsätze ordnungsmäßiger Datenverarbeitung
Routing
Abstand
Charakteristisches Polynom
Lineares Funktional
Interpretierer
App <Programm>
Punkt
App <Programm>
Gruppenoperation
Bitrate
Homepage
Einfache Genauigkeit
Übergang
Arithmetisches Mittel
Informationsmodellierung
Bildschirmfenster
Datentyp
Makrobefehl
Abstand
Modelltheorie
Charakteristisches Polynom
Makrobefehl
Umwandlungsenthalpie
Mapping <Computergraphik>
Subtraktion
App <Programm>
Basisvektor
Mereologie
Interaktives Fernsehen
Kartesische Koordinaten
Speicherabzug
Biprodukt
App <Programm>
Übergang
Informationsmodellierung
Prozess <Physik>
Matching <Graphentheorie>
App <Programm>
Mailing-Liste
p-Block
Datenfluss
Schnelltaste
Informationsmodellierung
Rechter Winkel
App <Programm>
Grundsätze ordnungsmäßiger Datenverarbeitung
Message-Passing
Raum-Zeit
Schnittstelle
Lineares Funktional
Web Site
Sichtenkonzept
Datenverarbeitungssystem
Rechter Winkel
App <Programm>
Minimum
Rechenschieber
Computer
Kartesische Koordinaten
Message-Passing
Gerade
Office-Paket
Turtle <Informatik>
Telekommunikation
Quader
Prozess <Informatik>
Rechter Winkel
App <Programm>
Minimum
Rechenschieber
Bildgebendes Verfahren
Message-Passing
Turtle <Informatik>
Telekommunikation
Informationsmodellierung
Punkt
App <Programm>
Rechenschieber
Kartesische Koordinaten
Frequenz
Turtle <Informatik>
Informationsmodellierung
App <Programm>
Rechenschieber
Interaktives Fernsehen
Kartesische Koordinaten
Makrobefehl
Trennungsaxiom
Framework <Informatik>
App <Programm>
Kartesische Koordinaten
URL
Homepage
Einfache Genauigkeit
Distributionstheorie
Bloch-Funktion
Informationsmodellierung
YouTube
Korrelation
App <Programm>
Natürliche Zahl
Widget
Mobiles Internet
Systemplattform
Systemaufruf
Message-Passing
Raum-Zeit
Keller <Informatik>
Kontrollstruktur
App <Programm>
Interaktives Fernsehen
Biprodukt
Übergang
Subtraktion
App <Programm>
Interaktives Fernsehen
Kartesische Koordinaten
Biprodukt
Frequenz
Differential
Generator <Informatik>
Informationsmodellierung
Gruppe <Mathematik>
Mereologie
Hypermedia
Programmierparadigma
Datenstruktur
App <Programm>
Mustersprache
Kartesische Koordinaten
Homepage
Eins
Telekommunikation
Videospiel
Sampler <Musikinstrument>
App <Programm>
Zahlenbereich
Vorzeichen <Mathematik>
Biprodukt
Arbeitsplatzcomputer
Homepage
Vorzeichen <Mathematik>
Gruppe <Mathematik>
Arbeitsplatzcomputer
Stichprobenumfang
Speicherabzug
Beweistheorie
Avatar <Informatik>
Schreib-Lese-Kopf
App <Programm>
Standardabweichung
Punkt
App <Programm>
Übergang
Eins
Soundverarbeitung
Benutzerbeteiligung
Prozess <Informatik>
Extrempunkt
App <Programm>
Kartesische Koordinaten
Inhalt <Mathematik>
Gerade
Bildgebendes Verfahren
Stichprobenfehler
Instantiierung
Avatar <Informatik>
Touchscreen
Bit
Existenzaussage
App <Programm>
Kartesische Koordinaten
Inhalt <Mathematik>
Biprodukt
Task
App <Programm>
Hausdorff-Dimension
Kantenfärbung
Quellcode
Whiteboard
Bildgebendes Verfahren
Softwaretest
Parametersystem
App <Programm>
Mathematisierung
Interaktives Fernsehen
Kartesische Koordinaten
Ähnlichkeitsgeometrie
Kontextbezogenes System
Biprodukt
Druckertreiber
Notebook-Computer
Datentyp
Vererbungshierarchie
Bus <Informatik>
URL
Maßerweiterung
Mailing-Liste
Prozess <Informatik>
App <Programm>
Gruppe <Mathematik>
Mathematisierung
Kartesische Koordinaten
Indexberechnung
Physikalisches System
Programmierumgebung
B-Spline
Message-Passing
Resultante
Nichtlinearer Operator
Wellenpaket
App <Programm>
Computersicherheit
Interaktives Fernsehen
Kartesische Koordinaten
Computer
Informationsmodellierung
Druckverlauf
Datensatz
Client
Prozess <Informatik>
Gruppe <Mathematik>
Konditionszahl
Digitaltechnik
Speicherabzug
Speicherabzug
Information
Analytische Fortsetzung
App <Programm>
Interaktives Fernsehen
Speicherabzug
Kartesische Koordinaten
Tangente <Mathematik>
Richtung
Eins
Informationsmodellierung
Korrelation
App <Programm>
Speicherabzug
Makrobefehl
Interaktives Fernsehen
Symboltabelle
Kartesische Koordinaten
Speicherabzug
Symboltabelle
Maßerweiterung
Funktion <Mathematik>
Spieltheorie
App <Programm>
Interaktives Fernsehen
Information Retrieval
Autorisierung
ATM
Videospiel
Bit
Punkt
Ortsoperator
App <Programm>
Atomarität <Informatik>
Computersicherheit
Interaktives Fernsehen
Kartesische Koordinaten
Element <Mathematik>
Informationsmodellierung
Datentyp
Lemma <Logik>
Vererbungshierarchie
Speicherabzug
Grundraum
Analysis
Einfach zusammenhängender Raum
Bildschirmmaske
Web Site
App <Programm>
ATM
Hilfesystem
Kartesische Koordinaten
Quick-Sort
Homepage
Einfache Genauigkeit
Internetworking
Einfach zusammenhängender Raum
Quader
Korrelation
App <Programm>
Datensichtgerät
Gruppe <Mathematik>
Netzwerkbetriebssystem
Kartesische Koordinaten
Term
Message-Passing
Einfach zusammenhängender Raum
App <Programm>
Server
Interaktives Fernsehen
Speicherabzug
Gammafunktion
Biprodukt
Inzidenzalgebra
Einfache Genauigkeit
Homepage
Soundverarbeitung
Videospiel
Sensitivitätsanalyse
Momentenproblem
Reelle Zahl
App <Programm>
Browser
Server
Bildgebendes Verfahren
App <Programm>
Mustersprache
Programmbibliothek
Entwurfsmuster
Implementierung
Projektive Ebene
Kartesische Koordinaten
Entwurfsmuster
Programmbibliothek
Biprodukt
Videokonferenz
Streuungsdiagramm
Offene Menge
COM
Dienst <Informatik>
Ereignishorizont

Metadaten

Formale Metadaten

Titel Designing for Ember Apps
Serientitel Ember Conf 2015
Autor Trevathan, Steve
Lizenz CC-Namensnennung - Weitergabe unter gleichen Bedingungen 3.0 Unported:
Sie dürfen das Werk bzw. den Inhalt zu jedem legalen und nicht-kommerziellen Zweck nutzen, verändern und in unveränderter oder veränderter Form vervielfältigen, verbreiten und öffentlich zugänglich machen, sofern Sie den Namen des Autors/Rechteinhabers in der von ihm festgelegten Weise nennen und das Werk bzw. diesen Inhalt auch in veränderter Form nur unter den Bedingungen dieser Lizenz weitergeben.
DOI 10.5446/34727
Herausgeber Confreaks, LLC
Erscheinungsjahr 2015
Sprache Englisch

Inhaltliche Metadaten

Fachgebiet Informatik
Abstract Ember allows us to design highly adaptive, extendable, and fast web apps, but with those possibilities comes greater responsibility. Successfully leveraging the characteristics that make the technology worth while requires a myriad of methods, principles, and patterns that aren’t readily obvious to those breaking into single page application design. In this talk I’ll hone in on those requirements with relevant examples and give the audience a starting point to make their next Ember.js product design successful.

Ähnliche Filme

Loading...
Feedback