Merken

Building an open source imagery browser: UX and technical decisions to develop OpenAerialMap

Zitierlink des Filmsegments
Embed Code

Automatisierte Medienanalyse

Beta
Erkannte Entitäten
Sprachtranskript
argument in everybody my name is many of his own and I'm from different space hundreds and working in interviews and that's not the session is I think it's a nice way to continue after the the keynote from the European Commission about the availability of a lot of of of the observation data uh so let's start with openers the hybrid on my name is Daniel Silver Award for development seed and they bring you open enrollment it also known as building an open-source imagery browser you x and technical decisions to develop over yeah I'm working
very short battle for my talk because this is not going uh has anyone heard of over a before where the OEM project 0 well OK that's that's nice not expecting it in so I'm going to explain to everyone else within the problems we're trying to solve with this tool and why we decided to build it and then some considerations around uh decisions we have to make all developing it so 1st things 1st of all what kind of problems are trying to solve why did we decide to
build it we notice it was the lack of imagery for disaster response and this kind of imagery usually it's to be as apt to date and as available as possible users need to yield to find it pretty easily so to actually have an impact the 2 images from satellites and manned aerial vehicles and all of that of a graph become increasingly available after a disaster nowadays especially because you have a lot of organizations and even individuals that just as capture a lot of imagery that then share with the world so what open tries to do is to provide a simple way for users to a search find and then use and this kind of image for humanitarian a response in disaster preparedness the good example of this it's actually during the ball out mammals guinea as
you can see the progress of the OSM and it's in the
background happening bands
this was done using aerial footage of so
68 volunteers were able to map this big region
in a very short time
and this is very important for us preparedness because then the
proper authorities that can get
to the different places they can know what the facilities are
available where they are and this can actually make
a significant change in
people's lives and how How help
is this going to place that d open images what is actually the basis upon which the OEM project is built it's a network of openly licensed image using greedy cup Commons by 4 it's a distributed system not in the usual IT sense of distributed systems but in a sense that any person or entity can actually host 1 of these away and notes and it's actually pretty easy to do so and to contribute with imagery to our our system essentially we have 2 ways 1st 1 is to host 1 these notes yourselves you follow the instructions that are less than the readme you have to really see imagery under a CC-BY 4 so needs to be open and available for anyone and then once you add your information to the Register you're done and it's available it's out there for anyone to use there however if you can't afford to post node if you don't want to do so if you have the technical skills or the time to maintain 1 you can still out so contribute with imagery that you can use the Apollo there which is a form that we build and upload images to the hot wire note I'm going at the form of a little bit further in the next slide but they have mentioned only MMS open map but what is this what when I'm when I'm talking about here so M is actually a set of tools so we have different little components and we use them to find and share the images available on the 0 I so the 1st component is the catalog the catalog is responsible for indexing all the imagery in all the nodes in the O I and then making it available through this powerful API as supports and filtering by different properties like a bounding box uh the provide position date but it basically any property that's that's available however that this catalog and although can allow users to find all the images they're looking for it's a very curator it's about power users that not every user is able to understand and again response not every uses civil to use an API and so but at this point we knew the way forward the average joe to be able to use it to be able to query the system and get the information they wanted so and there's the browser as a solution the only audio and browser that provides sort tries to provide a simple way for Europe Common User to search find and use this kind of imagery OK let's see if we can get a little bit more this working that OK so and here's the
quality has a lot of my so this is actually the browser as it is right now but it provides a great based interaction so users can search for a specific location or they can just browse the world will end find whatever by solving for some each cell shaded according to the number of images
available and then you get a little number that tells you how many footprints of role this specific cell plus so let's look something up so want to select something you get the preview of the footprints there and then you
can have be review of the map this image is the very low resolution 1 so it comes from months of age and that for a satellite get like a very very big image but I haven't another a very nice
forms in the Philippines so let's go to those work but it's so
this is the same as far as you can see it's along little suspect because this image covers an incredibly small area it's captured by the UAB but it's incredibly high resolution so 4 centimeters and this is very very good for tracing purposes and so what the user responded with kind of images looking forward in the downloaded or they can use it directly in the foreseeable point of some ideal Johnson just any software that supports the masses can have to be able to to
find images more easily and also to we also support a simple filtering like like time frame or by the resolution you looking for or even if you want all images for just the 1 with the with the MSE so in brief this is what the browser there's notable like so the back so
the grid the actual browser grid was the most difficult thing to do in deal project not just technically but also a conceptually we had to figure out a way to show a lot of imagery uh in a simple way but yet powerful some way that would not overwhelm the user but our 1st try was to just place all the footprint on a map and see how this would work so it didn't of course it's a lot of noise you can if you're out where things and or where things start and you are not able to actually pick a specific specific footprints we have different sensors we have these images covering different areas coming from satellites you if he's drones that then people stitch the together so this kind of approach doesn't really work and so drawing inspiration from the heck screen experiments of drift yes indeed battleship game actually we end up playing a few rounds and we came up with this kind of core but grid uh basically it's the cell agreed that covers the for the Euler and then itself it's colored according to the number of footprints intersect so lighter colors less footprints topical more footprints that it's very easy for the user of understand that and it's very easy to navigate because light areas last without varies more and it's simple the user can just find the air is looking for and then you can zoom in and more granularly pick whatever you're looking for so the idea was there now the building process we ended up having 3 different variations of discrete so the 1st uh and option was that we started with was to a droplet based on geographical coordinates this seemed to work well but then we start moving away from the equator can we got 2 rectangles instead of squares and this was also the dramatic for the user because and for someone that doesn't keep in mind now the maps work and that you have like a projection and the earth is round it's it's weird it seemed that we Europe we're covering more area as we moved away from the equator although this is not true in the user would just get confused at this and then you get to the polls and the new directives of so long it becomes difficult to use and so we changed our approach to a kind of pixel perfect rate which we call the flow of pixel perfect pretty it's drawn based on pixels of course but by converting between coordinates and the pixels every time it's not as geographically accurate as the other 1 because once you get near the poles since the squares are always in size they pick up a smaller area but from navigation standpoint it's our problem because it the DDD the intersections of still calculated correctly and so it we won't be lying to the user that but it's so this is how it would work however this certainly had some problems with so it was not perform so as you can see OK as I as what is status all sorry this was explained a new screen interesting OK so we get to the point I want to go so here so here we actually zoomed out of 1 level and as you can see the squares got smaller and the colors disappear as since we had like fixed-size squares as soon as we saw the upper level we need it Wetmore squares to the map and the browser just couldn't cope with this because the muskrats increased exponentially and the browser would just stop working so we actually had to limit the zoom level and actually disable the Korup at the levels this was a big problem for the user because you do this context so at this level you wouldn't know where images where nor where to find them you went to either zoom in and then back there you you couldn't have like a global view of the of the system which was also a problem the head the solution for this was to use a resume independent grid which is what's implemented right now and what we've seen on the on the browser um it it is unique for might thank you so but isn't C the number of squares on-screen it's almost always the same and as assuming we have a increase in ratio of 1 to 4 so each allele square the becomes for different squares monsters remains so you can see that when the testimony 26 when you zoom in it will become for different squares so this concentration and make so that the users don't lose context of what's happening and in the area that they take up it's always the same so would be the square doesn't move and the imagery is not lost this is way faster for the brother friend there because a number of credits lower it's easy for the user and we can have d equal but always visible which gives us a very nice worldview like this you can immediately see where imagery is and what's available OK some text that now we have to build all this we used map box for the map which will be giving a fantastic books as well so we have a lot of experience with the working with an epoxy it's a very powerful system it supports powerful styling it's and it's very easily extensible and then we decided to pair it with react so when you started building this like 1 year ago or so react showed a good promise and and ice growth and evolution it's open source it has a good community and it's it's very simple to use at developments in we also often go and strive for cutting edge technologies and new things and trying new approaches to things in the past we have actually try to pair met box and angular but it turned out not to be as easy as with react but it reacts unidirectional dataflow are actually makes for a very nice integration between the 2 of them especially because of how its response to the events and it as the top-to-bottom rendering process which was also interesting that besides all this we use Travis to keep everything in check people that that's running and to keep everything deployed always think so I've mentioned in the beginning of some of the tools that make up only including the catalog and the browser which we've them eventually there but we have some some or some other ones so the 1 of the people there so this is the tool you can use to upload images to the hot wire note and it's also former to develop it's not fully open to everyone you need a token to be able to use it but it's a breeze get you just have to state their intentions with kind of mystery have and then your assigned 1 in your this is just so that we can try to reduce the number of spam images we we get but we have like a documentation that basically gathers everything every information about project quite different tools are built what they can do and actually also how to run your local copy it's still the information is still being added to it some development so if you rather it you may find coming soon message somewhere and the last but not least we have the design system so designed system here has enough material for a top of its own so I'm going to go over it very briefly it's basically a set of styles guidelines and other kind of shareable coat components to be used throughout the way ensure of visual and you have real consistency uh if someone else someone starts a new apyrene for iambic just installed this design system and they will have a bunch of pre-made tools and styles of interest use so that everything looks more as part of its and branding then we have a nice blog post about sensors and invited the diagnosis cities such as and systems and on why they're important and why we think they're a a good approach to some some 2 types of projects so what does the future look like for all and uh the 1st thing we want to do is to simplify the contribution process how people can actually help us but most of this will be done by a simplifying the process of approving imagery and contributing with imagery to the to the project and we also were looking to get more organizations level and nodes so if any of you guys has images that they can share all they want to share with the or you can find them somewhere but please consider getting to know that or if you can do that just contribute to the to opponent that also always helps but other way to get involved is with gold if you're a programmer you can just contribute to it goes to help us out otherwise just go over the tools we built give us opinions give us ideas everything is open source everything is available under the Ottawa organization it up so just check it out and let us know what you think that thank you very much so we have some time for additional questions if anyone wants to know anything about that because it was wondering about
the growing a lot of data that might be of the of the of the of the law and the letter of of the use the all right you know what about this moment the only point of X is we have through the Council of the which is that Jason API we can get information and metadata about all the all the images that we have here already the quality of the model on real life world but that's that's interesting and it may be something we we eventually to there are some of the values of of the the center of the which is on file based theories that later on want look good on you know what they can and all of and that will not have the self help from other people out and then they can be answered in this and the time you don't mind by this experiment in a that yeah definitely deflating maybe someday we will implement but think this this was the 1st 1 is would like it it is yeah sure definitely that would be it would be amazing actually is there is yeah yeah I actually yes so a is and you have to 2 ways to do it you either of the node if you can and then you have you UQ could be the owner let's say of the Belgian node or that if you can't do that you can just get the imagery and unipolar through the appeal to form uh but you have to make sure that you can do that and that that'd be the image we can become available under CC BY 4 but besides that yes it did not contain essentially yeah so this the no you few of the like the raw imagery you can use the India Poland
which shows this 1 yeah so this little form and it goes on but basically you know down
here you have fields for for all the images and even just put the links to the images in the people in this approach the hot Moyano uh which is our note if you can't have a euro
yes and the the overlapping images as the on the browser so the present only allows for the preview of 1 image at a time you you get the side panel with all the images available for a specific rate for a specific cell and then you can just select that whatever you want and there is some filtering allowed by lack of time frame last year last month last week but then once you have all the results you just have to go like 1 by 1 to see that the the the metadata and get whatever you want if if you're looking for a more powerful interaction and then DAPI would be the way to go yes there I'm not entirely sure I think Judith is the the best performance you can upload images and the elevation data we're not using it at the moment in the browser and I would showing it but it will it will be stored as a property in the database may be for a future learning process it's but right now we assume everything Amazon S 3 buckets so going on it's it's very easy to have a 0 and node you had you need to have a place which is accessible by everyone like mystery bucket or your own server if you will and then just for the section to read me which is basically at you at the URL so you're noted that to the rate at which a registered to interested and that's it then that we're working the problems the index everything and as long as the above it is accessible then uh you will find that the problem we hear the question you have but there are no it's English only uh we we don't have the multilingual support from and that's something that we had considered for the future it it yeah should bear developed 0 open source so you can find the understand and the huddle assembling it up and yeah and if you go to school so so please that deals no effect and thank you very much again you can find me on the the word but it so you can find
me 100 then this alone but there or in your social media file is seminal or if you want more questions so our
work of private property around so just common from that
Beobachtungsstudie
Offene Menge
Open Source
Parametersystem
Subtraktion
Offene Menge
Browser
Open Source
Browser
Hybridrechner
Softwareentwickler
Raum-Zeit
Entscheidungstheorie
Satellitensystem
Graph
Gemeinsamer Speicher
Selbst organisierendes System
Browser
Computeranimation
Entscheidungstheorie
Endogene Variable
Spezialrechner
Open Source
COM
Endogene Variable
Vorlesung/Konferenz
Projektive Ebene
Bildgebendes Verfahren
URN
Sechsecknetz
Arithmetische Folge
Gruppe <Mathematik>
Vorlesung/Konferenz
Gebäude <Mathematik>
Neunzehn
Offene Menge
Bit
Punkt
Quader
Ortsoperator
Browser
Gebäude <Mathematik>
Online-Katalog
Computeranimation
Bildschirmmaske
Knotenmenge
Online-Katalog
Datennetz
Endogene Variable
Mapping <Computergraphik>
Vorlesung/Konferenz
Zusammenhängender Graph
Greedy-Algorithmus
Bildgebendes Verfahren
Hilfesystem
Leistung <Physik>
Autorisierung
Automatische Indexierung
URN
Datennetz
Kategorie <Mathematik>
Browser
Verteiltes System
Störungstheorie
Physikalisches System
Menge
Quick-Sort
Rechenschieber
Mapping <Computergraphik>
Menge
COM
Automatische Indexierung
Offene Menge
Betafunktion
Basisvektor
Projektive Ebene
Information
Browser
Weitverkehrsnetz
Interaktives Fernsehen
Zellularer Automat
Zahlenbereich
URL
Bildgebendes Verfahren
Mapping <Computergraphik>
Weitverkehrsnetz
Zellularer Automat
Zahlenbereich
MIDI <Musikelektronik>
Extrempunkt
Bildgebendes Verfahren
Bildauflösung
Datensatz
Bildschirmmaske
Punkt
Flächeninhalt
Verschlingung
Software
Rohdaten
Hochvakuum
Ruhmasse
Vorlesung/Konferenz
Bildgebendes Verfahren
Bildauflösung
Metropolitan area network
Rahmenproblem
Browser
Mapping <Computergraphik>
Bildgebendes Verfahren
Gesetz <Physik>
Bildauflösung
Offene Menge
Satellitensystem
Einfügungsdämpfung
Programmiergerät
Prozess <Physik>
Punkt
Web log
Browser
Gewichtete Summe
Familie <Mathematik>
Gleichungssystem
Oval
Richtung
Eins
Übergang
Monster-Gruppe
Komponente <Software>
Metropolitan area network
Perfekte Gruppe
Mapping <Computergraphik>
Visualisierung
Tropfen
Addition
URN
Sichtenkonzept
Prozess <Informatik>
Gebäude <Mathematik>
Güte der Anpassung
Stellenring
Störungstheorie
Zoom
CAM
Gleitendes Mittel
Bitrate
Kontextbezogenes System
Knotenmenge
Ereignishorizont
Konfiguration <Informatik>
Sinusfunktion
Quader
Polstelle
Feuchteleitung
Emulation
Menge
COM
Einheit <Mathematik>
Evolute
Projektive Ebene
Information
Pixel
Message-Passing
Subtraktion
Hecke-Operator
Quader
Selbst organisierendes System
Perfekte Gruppe
Rechteck
Zellularer Automat
Geräusch
Zahlenbereich
Unrundheit
Online-Katalog
Diskrete Gruppe
Physikalisches System
Textur-Mapping
Rendering
Spieltheorie
Datentyp
Endogene Variable
Zoom
Euler-Diagramm
Zusammenhängender Graph
Softwareentwickler
Stochastische Abhängigkeit
Bildgebendes Verfahren
Widerspruchsfreiheit
Touchscreen
Schreib-Lese-Kopf
Pixel
Open Source
Physikalisches System
Datenfluss
Keller <Informatik>
Integral
Mapping <Computergraphik>
Quadratzahl
Flächeninhalt
Mereologie
Speicherabzug
Hill-Differentialgleichung
Kantenfärbung
Videospiel
Punkt
Momentenproblem
Elektronische Publikation
Gesetz <Physik>
Physikalische Theorie
Metadaten
Bildschirmmaske
Informationsmodellierung
Knotenmenge
Rechter Winkel
Reelle Zahl
Information
Bildgebendes Verfahren
Hilfesystem
Resultante
Prozess <Physik>
Rahmenproblem
Momentenproblem
Kategorie <Mathematik>
Browser
Open Source
Datenhaltung
Gewichtete Summe
Zellularer Automat
Interaktives Fernsehen
Binder <Informatik>
Bitrate
Kombinatorische Gruppentheorie
Ultraviolett-Photoelektronenspektroskopie
Computeranimation
Nichtlineares Zuordnungsproblem
Einheit <Mathematik>
Automatische Indexierung
Server
Garbentheorie
Wort <Informatik>
Bildgebendes Verfahren
COM
Kategorie <Mathematik>
Hypermedia
Besprechung/Interview
Gewichtete Summe
Vorlesung/Konferenz
Elektronische Publikation
Computeranimation

Metadaten

Formale Metadaten

Titel Building an open source imagery browser: UX and technical decisions to develop OpenAerialMap
Serientitel FOSS4G Bonn 2016
Teil 55
Anzahl der Teile 193
Autor Silva, Daniel da
Mitwirkende Daniel da Silva (Development Seed)
Lizenz CC-Namensnennung 3.0 Deutschland:
Sie dürfen das Werk bzw. den Inhalt zu jedem legalen 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.
DOI 10.5446/20418
Herausgeber FOSS4G
OSGeo
Erscheinungsjahr 2016
Sprache Englisch

Inhaltliche Metadaten

Fachgebiet Informatik
Abstract Last summer the new OpenAerialMap launched. OpenAerialMap (OAM) is now providing access to open satellite, aerial, and UAV imagery around the world. Users can search through a web-based map browser, conduct geographic queries to an API, upload imagery to publish openly licensed imagery, and process imagery into tile map services. Searching through many sources of imagery in a usable way was one of the biggest challenges we saw when designing the system. We knew usability was going to be critical to the adoption and success of OAM so we created a new type of grid interaction to search and find imagery. This talk will present the design and technical build process for developing the new OAM map browser and the open source tools that power the system. We'll discuss our UX experiments and how they influenced the build process, and talk about how and why we used React JS to build a grid-based imagery browser. The OAM community of open source tools is growing over the next year. We'll also provide a recap of the roadmap for the next year and how anyone can get involved.
Schlagwörter Development Seed

Zugehöriges Material

Ähnliche Filme

Loading...