THAT Conference, held at the Kalahari Resort in Wisconsin Dells, Wisconsin, was an unbelievable experience filled with great people, useful sessions, and fun activities. I was thrilled to be able to represent Brilliance at THAT Conference and had a fantastic time connecting with hundreds of developers and technical professionals throughout the event.
THAT Conference is the "Summer Camp for Geeks" that combines technology, networking, social events and exposure to trends. Over four days, folks of diverse technology backgrounds and expertise levels gather to take advantage of multiple learning mediums. In short, it is a tech conference for developers, rooted in community, exploring the internet of things, and all technologies used for mobile, web & cloud.
THAT Conference had a variety of attendees and topics such as:
-
Domain experts
-
New and continuing users, designers and practitioners of frameworks, processes, and tools
-
Community and mindfulness
In addition to talks, attendees can organize Open Space circles on any topic they’re interested in as experts or as novices for more direct communication. I found these ad hoc gatherings led to great discussions because of the enthusiasm of participants and the small group setting.
Although there were many fantastic sessions and keynote speakers, here are some of my key takeaways and notes from the “Embracing Object-Oriented UX for better products (and happier teams)” and “Demystifying Front-End Security” sessions. Don’t hesitate to contact me if you have any specific questions, I’d be happy to steer you in the right direction.
Embracing Object-Oriented UX for better products (and happier teams)
Presented by: Caroline Sober-James, Director of User Experience, Acumium
OVERVIEW
OOUX is a design methodology that helps us define usable, consistent products that naturally align with end-users’ mental models. Similar to OOP, it asks us to define the objects in the real-world problem domain and design the information and relationships in each object before designing how the user might manipulate them. It's a powerful tool for any digital team because it's relatively easy to do for tech, product, stakeholders, and users.
OOUX in four parts:
-
Complexity analysis
-
Requirements definition
-
Prioritization
-
Sketching
MY NOTES
Sketch initial object relationships
Core object relationship model
2. Previews navigation design
3. E.g. B2B Distributor site :
-
-
-
-
Brands
-
Products
-
Categories
-
Search results
-
RMA
-
Orders
-
-
-
CTA Inventory
Begin to stub out user stories in Trello or a spreadsheet
● Describe the who, what, why, when, where, and how for each interaction
Digital packaging that’s consistent and recognizable
Now, we can avoid scary UI pitfalls:
● Shapeshifter modules
● Masked, broken, isolated objects
Let’s start working on UI:
-
Package objects into modules and detail screens
-
Show how a user would navigate from screen to screen
-
Map out and test task flows
-
Create list and landing pages
Storyboard the task flows:
-
Evaluate your top CTAs
-
Think about all the steps in a procedure – Where is the conditional logic?
-
Ask your users what they’d expect to happen if they initiated one of these flows?
Demystifying Front-End Security
Presented by: Ilya Verbitskiy, Security Consultant & Co-Founder, WebStoating s.r.o.
OVERVIEW
JavaScript development is not about building web-applications anymore: JavaScript can be used for building native mobile and desktop applications as well. It brings bigger responsibilities to front-end engineers to make sure that our applications are secure.
MY NOTES
Cross Site Scripting (Xss) Impact
● Account hijacking (eg. session cookie)
● Steal credentials (eg. last pass spoof)
● Drive-by downloads (eg. bulletin board comments)
● Crypto mining (run crypto mining software on customer machines)
-
Keyloggers
-
Port scan (timings -> is there a server behind a firewall?)
-
Site Defacement
BeEF – Browser Exploitation Framework Project
● Open source browser exploitation framework
● beefproject.com
● Contains 100+ modules
● Antivirus detects default installation, BeEF can be modified to avoid fingerprinting
Vectors
-
Reflected XSS
-
-
Query string
-
Tiny url, QR codes
-
-
Stored XSS
-
-
Was mitigated by browser XSS protection, but too many false positives
-
-
DOM based XSS
○ Attacker creates DOM node client side
○ URL hash vector
○ Renders waf meaningless
○ Check params when reading hash
-
JS in SVG
-
-
Eg, image uploader; Can have js in svg definition.
-
Browsers don't exec js in <img>, background-image; do exec in inline or <embed>, <object>, <iframe>
-
Webpack renders svg inline
-
-
Markdown
-
-
Still need to strip tags from markdown
-
-
Frameworks
-
-
React: dangerouslySetInnerHTML
-
-
React: does good job of html sanitation
-
User-entered text can be exploited
-
-
Angular: [innerHTML]
-
VueJS: v-html
-
Click here for more session information.
For more information on THAT Conference, please visit https://www.thatconference.com/.
Want more information on a specific topic not covered? Let us know!
