xnths.

Colophon

This site applies findings from research on first impressions, credibility and how technical work is evaluated. Each design decision below names its source.

Layout conventions also follow the exemplars curated in the developer-portfolios repository by Emma Bostian. github.com/emmabostian/developer-portfolios

SourceFindingDecision on this site
[1]Visual-appeal judgments formed in 50 ms agree with judgments made after much longer viewing.The first viewport carries only a name, a positioning line and the USP Aberta headline numbers. No carousel or animation is needed to understand the page.
[2]Websites with low visual complexity and high prototypicality were rated most appealing, with effects visible from 17 ms.A conventional portfolio skeleton (top navigation, name, featured work, index, contact), a single reading column and generous whitespace. No terminal, desktop or 3D gimmicks.
[3]Preferred colorfulness and visual complexity differ across audiences; higher education generally lowers the preference for colorfulness.The audience is academic and technical, so the palette is muted neutrals with a single accent, reserved for links and figure highlights.
[4]Perceived aesthetics correlate strongly with perceived usability, before and after use.Effort goes into typography (type scale, rhythm, tabular numerals) instead of decoration.
[5]In a study with 2,684 participants, the “design look” of a site was the most cited credibility cue (46.1% of comments), followed by information structure.One consistent design system across every route and a clear information architecture.
[6]Credibility depends on what users notice (prominence) and how they interpret it.Credentials are prominent and easy to interpret: institutional credits, a link to the live system, dates, and the method next to every number.
[7]Evaluators of developers rely on visible activity traces as signals of skill and commitment.Real artifacts instead of self-description: the live system, architecture figures, test inventory, commit history span, changelog cadence and benchmarks. No skill progress bars.
[8]Recruiters struggle to interpret and trust aggregated signals about developers.Every metric states baseline, result, date and method, and caveats are written down (for example, the graph benchmark result holds only for one-hop traversals).
[9]People make inferences about skills and commitment from visible, networked activity.The project timeline and the public changelog are linked, so the cadence of work can be checked.
[10]Developers criticize technical hiring for its lack of real-world relevance.The case study has real-world depth: decisions, trade-offs, incidents and post-mortems rather than puzzles.
[11]Interviews with 59 experienced engineers identified attributes of great engineers that go well beyond writing code.Each case-study section follows Problem → Decision → Trade-off → Result, showing judgment and not only output.
[12]The “martini glass” structure: an author-driven narrative first, then reader-driven exploration.The case study opens with a guided narrative; a sticky table of contents and deep links to the live system then let readers explore.
[13]People forage for information by following “information scent”.Descriptive link labels (“Read the case study”, not “More”), a capability index that names each topic, and anchored section headings.
[14]Signals are credible when they are costly to fake.Verifiable specifics (numbers, public URLs, papers) are preferred over adjectives.
[15]WCAG 2.2 defines testable accessibility criteria.AA contrast in both themes, visible focus, reduced-motion support, a skip link and semantic landmarks, checked automatically with axe.

References

  1. [1]Lindgaard, G., Fernandes, G., Dudek, C., & Brown, J. (2006). Attention web designers: You have 50 milliseconds to make a good first impression! Behaviour & Information Technology, 25(2), 115–126.
  2. [2]Tuch, A. N., Presslaber, E. E., Stöcklin, M., Opwis, K., & Bargas-Avila, J. A. (2012). The role of visual complexity and prototypicality regarding first impression of websites. International Journal of Human-Computer Studies, 70(11), 794–811.
  3. [3]Reinecke, K., & Gajos, K. Z. (2014). Quantifying visual preferences around the world. Proceedings of CHI ’14, 11–20.
  4. [4]Tractinsky, N., Katz, A. S., & Ikar, D. (2000). What is beautiful is usable. Interacting with Computers, 13(2), 127–145. https://doi.org/10.1016/S0953-5438(00)00031-X
  5. [5]Fogg, B. J., et al. (2002). How do people evaluate a Web site’s credibility? Results from a large study. Stanford Persuasive Technology Lab and Consumer WebWatch.
  6. [6]Fogg, B. J. (2003). Prominence-interpretation theory: Explaining how people assess credibility online. CHI ’03 Extended Abstracts, 722–723.
  7. [7]Marlow, J., & Dabbish, L. (2013). Activity traces and signals in software developer recruitment and hiring. Proceedings of CSCW ’13.
  8. [8]Singer, L., Figueira Filho, F., Cleary, B., Treude, C., Storey, M.-A., & Schneider, K. (2013). Mutual assessment in the social programmer ecosystem: An empirical investigation of developer profile aggregators. Proceedings of CSCW ’13, 103–116. https://doi.org/10.1145/2441776.2441791
  9. [9]Dabbish, L., Stuart, C., Tsay, J., & Herbsleb, J. (2012). Social coding in GitHub: Transparency and collaboration in an open software repository. Proceedings of CSCW ’12.
  10. [10]Behroozi, M., Parnin, C., & Barik, T. (2019). Hiring is broken: What do developers say about technical interviews? Proceedings of IEEE VL/HCC 2019.
  11. [11]Li, P. L., Ko, A. J., & Zhu, J. (2015). What makes a great software engineer? Proceedings of ICSE 2015, 700–710.
  12. [12]Segel, E., & Heer, J. (2010). Narrative visualization: Telling stories with data. IEEE Transactions on Visualization and Computer Graphics, 16(6). https://doi.org/10.1109/TVCG.2010.179
  13. [13]Pirolli, P., & Card, S. (1999). Information foraging. Psychological Review, 106(4), 643–675.
  14. [14]Spence, M. (1973). Job market signaling. The Quarterly Journal of Economics, 87(3), 355–374.
  15. [15]W3C (2023). Web Content Accessibility Guidelines (WCAG) 2.2. https://www.w3.org/TR/WCAG22/
Colophon — Jonathas Castilho